SJ,XJ,RKJ加拍照限制

xwt

2025-11-13 252915c14e8d8ba92f2f41635a1c802c4503e52a

 pages/QC/RKJ/detail.vue

@@ -67,21 +67,6 @@
    <view class="section">
      <view class="section-header">检验结果</view>
      <view class="section-body">
        <view class="info-grid">
          <view class="info-item">
            <view class="info-label">AC数</view>
            <view class="info-value">{{formData.freQty ? formData.freQty - 1 : 0}}</view>
          </view>
          <view class="info-item">
            <view class="info-label">RE数</view>
            <view class="info-value">{{formData.freQty || 0}}</view>
          </view>
          <view class="info-item">
            <view class="info-label">不合格数</view>
            <view class="info-value">{{formData.unqualified || 0}}</view>
          </view>
        </view>

        <view v-if="formData.result != null" class="result-preview">
          <view class="info-label">预览结果</view>
          <view class="info-value">{{formData.result}}</view>
@@ -98,23 +83,19 @@
    <view class="section">
      <view class="section-header">检验结果录入</view>
      <view class="section-body">
        <view class="inspection-hint">
          <view class="hint-text">没有最大值和最小值时填写0（未通过检验）或1（通过检验）</view>
        </view>
        
        <!-- 不合格检验项目提示 -->
        <view class="validation-hint" v-if="isUnqualifiedResult()">
        <!-- 验证提示 -->
        <view v-if="isUnqualifiedResult()" class="validation-hint">
          <view class="validation-icon">⚠️</view>
          <view class="validation-text">
            <view class="validation-title">检验项目不合格，必须完成以下操作：</view>
            <view class="validation-requirements">
              <view class="requirement-item" :class="{ 'completed': hasImage(), 'required': !hasImage() }">
                <text class="requirement-icon">{{ hasImage() ? '✅' : '❌' }}</text>
                <text class="requirement-text">上传图片</text>
              <view class="requirement-item" :class="{ 'completed': hasImage() }">
                <view class="requirement-icon">{{ hasImage() ? '✅' : '❌' }}</view>
                <view class="requirement-text">上传图片</view>
              </view>
              <view class="requirement-item" :class="{ 'completed': hasRemarks(), 'required': !hasRemarks() }">
                <text class="requirement-icon">{{ hasRemarks() ? '✅' : '❌' }}</text>
                <text class="requirement-text">填写不良描述</text>
              <view class="requirement-item" :class="{ 'completed': hasRemarks() }">
                <view class="requirement-icon">{{ hasRemarks() ? '✅' : '❌' }}</view>
                <view class="requirement-text">填写不良描述</view>
              </view>
            </view>
          </view>
@@ -124,17 +105,40 @@
          <view class="input-wrapper">
            <input v-if="tableData.length < formData.levelNum"
              v-model="formData.fcheckResu"
              type="number"
              type="text"
              class="result-input"
              placeholder="请输入检验结果"
              placeholder="没有最大值和最小值时填写0（未通过检验）或1（通过检验）"
              placeholder-class="placeholder" />
            <button v-if="(tableData.length < formData.levelNum)"
              class="btn primary-btn"
              style="margin: 0px;background-color: #3498db;color:#ffffff ;" class="btn primary-btn"
              @click="submit">保存结果</button>
          </view>
        </view>
      </view>
    </view>

    <!-- 操作按钮 -->
    <view class="action-buttons">
      <button class="btn upload-btn" @click="saveRemarks">
        <view class="btn-content">
          <uni-icons type="compose" size="16" color="#fff"></uni-icons>
          <view class="btn-text">添加不合格描述</view>
        </view>
      </button>
      <button class="btn attachment-btn" @click="viewAttachmentInfo">
        <view class="btn-content">
          <uni-icons type="folder" size="16" color="#fff"></uni-icons>
          <view class="btn-text">查看检验项目</view>
        </view>
      </button>
      <button class="action-btn success tablet-upload-btn" @click="uploadImage">
        <view class="btn-content">
          <view class="btn-icon">📷</view>
          <view class="btn-text">拍照/上传图片</view>
        </view>
      </button>
    </view>

    <!-- 图片预览 -->
    <view v-if="isShowImg" class="section">
      <view class="section-header">
@@ -181,18 +185,6 @@
          </view>
        </view>
      </view>
    </view>

    <!-- 操作按钮 -->
    <view class="action-buttons">
      <button class="action-btn warning" @click="saveRemarks">添加不合格描述</button>
      <button class="action-btn primary" @click="viewAttachmentInfo">查看检验项目</button>
      <button class="action-btn success tablet-upload-btn" @click="uploadImage">
        <view class="btn-content">
          <view class="btn-icon">📷</view>
          <view class="btn-text">拍照/上传图片</view>
        </view>
      </button>
    </view>

    <!-- 修改检验结果弹出框 -->
@@ -1252,18 +1244,6 @@
  }
}

.inspection-hint {
  background-color: #fff3cd;
  padding: 10px;
  border-radius: 4px;
  margin-bottom: 15px;
}

.hint-text {
  font-size: 12px;
  color: #856404;
}

/* 验证提示样式 */
.validation-hint {
  background: linear-gradient(135deg, #ffe6e6 0%, #ffcccc 100%);
@@ -1305,19 +1285,16 @@
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  padding: 8px 12px;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 6px;
  border: 1px solid rgba(255, 107, 107, 0.3);
  transition: all 0.3s ease;
}

.requirement-item.completed {
  background-color: #d4edda;
  border: 1px solid #c3e6cb;
}

.requirement-item.required {
  background-color: #f8d7da;
  border: 1px solid #f5c6cb;
  background: rgba(46, 204, 113, 0.1);
  border-color: rgba(46, 204, 113, 0.3);
}

.requirement-icon {
@@ -1327,26 +1304,30 @@

.requirement-text {
  font-size: 13px;
  font-weight: 500;
  color: #2c3e50;
  font-weight: 500;
}

.requirement-item.completed .requirement-text {
  color: #27ae60;
}

.input-group {
  margin: 16px 0;
}

  .input-wrapper {
    display: flex;
    gap: 12px;
.input-wrapper {
  display: flex;
  gap: 12px;
}

    .result-input {
      flex: 1;
      height: 45px;
      padding: 0 12px;
      border: 1px solid $border-color;
      border-radius: 4px;
      font-size: 14px;
    }
  }
.result-input {
  flex: 1;
  height: 45px;
  padding: 0 12px;
  border: 1px solid $border-color;
  border-radius: 4px;
  font-size: 14px;
}

.btn {
@@ -1490,39 +1471,91 @@
}

.action-buttons {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  justify-content: flex-end;
  gap: 12px;
  margin-bottom: 20px;
}

.action-btn {
  padding: 12px 20px;
  border: none;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  padding: 8px 20px;
  border-radius: 4px;

  &.primary {
  &.primary-btn {
    background-color: $primary-color;
    color: white;
    color: #fff;
  }

  &.secondary {
  &.cancel-btn {
    background-color: #95a5a6;
    color: white;
  }

  &.warning {
    background-color: $warning-color;
    color: white;
    color: #fff;
  }

  &.success {
    background-color: $success-color;
    color: white;
    color: #fff;
  }
}

.btn {
  padding: 8px 20px;
  border-radius: 4px;
  border: none;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s;

  &.upload-btn {
    background-color: #909399;
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 12px 20px;
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    min-height: 48px;
    white-space: nowrap;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(144, 147, 153, 0.3);
  }

  &.upload-btn:hover {
    background-color: #7a7d82;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(144, 147, 153, 0.4);
  }

  &.attachment-btn {
    background-color: #17a2b8;
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 12px 20px;
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    min-height: 48px;
    white-space: nowrap;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(23, 162, 184, 0.3);
  }

  &.attachment-btn:hover {
    background-color: #138496;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(23, 162, 184, 0.4);
  }
}

@@ -1550,42 +1583,43 @@

/* 平板上传按钮样式 */
.tablet-upload-btn {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #2ecc71 0%, #27ae60 100%);
  box-shadow: 0 4px 15px rgba(46, 204, 113, 0.3);
  border: none;
  border-radius: 8px;
  padding: 12px 20px;
  color: white;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(46, 204, 113, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  margin: 0;
}

.tablet-upload-btn:hover {
  background: linear-gradient(135deg, #27ae60 0%, #229954 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(46, 204, 113, 0.4);
}

.tablet-upload-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 10px rgba(46, 204, 113, 0.3);
  box-shadow: 0 6px 16px rgba(46, 204, 113, 0.4);
}

.btn-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px;
}

.btn-icon {
  font-size: 24px;
  line-height: 1;
  font-size: 18px;
}

.btn-text {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
}

.overlay {
@@ -2103,88 +2137,8 @@
  }
}

/* 平板优化样式 */
@media (min-width: 768px) and (max-width: 1024px) {
  .action-buttons {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-bottom: 30px;
  }
  
  .action-btn {
    padding: 20px 16px;
    font-size: 16px;
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .tablet-upload-btn {
    min-height: 100px;
  }
  
  .btn-content {
    gap: 12px;
    padding: 12px;
  }
  
  .btn-icon {
    font-size: 32px;
  }
  
  .btn-text {
    font-size: 16px;
  }
  
  .info-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
  
  .section-body {
    padding: 30px;
  }
}

/* 大屏平板优化 */
@media (min-width: 1024px) {
  .action-buttons {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 40px;
  }
  
  .action-btn {
    padding: 25px 20px;
    font-size: 18px;
    min-height: 100px;
  }
  
  .tablet-upload-btn {
    min-height: 120px;
  }
  
  .btn-content {
    gap: 15px;
    padding: 15px;
  }
  
  .btn-icon {
    font-size: 36px;
  }
  
  .btn-text {
    font-size: 18px;
  }
  
  .info-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
  }
  
/* 响应式设计 */
@media (min-width: 768px) {
  .section-body {
    padding: 40px;
  }