部署修改

gaoluyang

8 小时以前 311712d06356714169281a2bbc20c171f1c2e661

 src/views/inventoryManagement/stockWarning/index.vue

@@ -41,27 +41,27 @@
      <!-- 操作按钮 -->
      <div class="table-operations">
        <el-button type="primary" @click="handleAdd">新增预警规则</el-button>
        <!-- <el-button type="success" @click="handleBatchProcess">批量处理</el-button> -->
        <!-- <el-button type="success" @click="handleBatchProcess">批量处理@</el-button> -->
        <el-button @click="handleExport">导出</el-button>
      </div>
      <el-table 
        :data="tableData" 
        border 
        v-loading="tableLoading" 
      <el-table
        :data="tableData"
        border
        v-loading="tableLoading"
        @selection-change="handleSelectionChange"
        style="width: 100%"
        height="calc(100vh - 280px)"
      >
        <el-table-column align="center" type="selection" width="55" />
        <el-table-column align="center" label="序号" type="index" width="60" />
        

        <!-- 基础信息字段 -->
        <el-table-column label="储气罐编码" prop="tankCode" width="120" show-overflow-tooltip />
        <el-table-column label="储气罐名称" prop="tankName" width="200" show-overflow-tooltip />
        <el-table-column label="储气罐类型" prop="tankType" width="120" show-overflow-tooltip />
        <el-table-column label="规格型号" prop="specificationModel" width="150" show-overflow-tooltip />
        <el-table-column label="容积(m³)" prop="volume" width="100" show-overflow-tooltip />
        

        <!-- 库存相关字段 -->
        <el-table-column label="当前气体量" prop="currentGasLevel" width="120" show-overflow-tooltip>
          <template #default="scope">
@@ -72,7 +72,7 @@
        <el-table-column label="最低气体量" prop="minGasLevel" width="120" show-overflow-tooltip />
        <el-table-column label="最高气体量" prop="maxGasLevel" width="120" show-overflow-tooltip />
        <el-table-column label="当前压力(MPa)" prop="currentPressure" width="140" show-overflow-tooltip />
        

        <!-- 预警规则字段 -->
        <el-table-column label="预警类型" prop="warningType" width="100" show-overflow-tooltip>
          <template #default="scope">
@@ -94,7 +94,7 @@
            <el-switch v-model="scope.row.isEnabled" @change="handleEnableChange(scope.row)" />
          </template>
        </el-table-column>
        

        <!-- 时间相关字段 -->
        <el-table-column label="预警时间" prop="warningTime" width="150" show-overflow-tooltip />
        <el-table-column label="预警持续天数" prop="warningDuration" width="120" show-overflow-tooltip />
@@ -115,32 +115,32 @@
            <span v-else>-</span>
          </template>
        </el-table-column>
        

        <!-- 操作列 -->
        <el-table-column fixed="right" label="操作" width="200" align="center">
          <template #default="scope">
            <el-button link type="primary" size="small" @click="handleEdit(scope.row)">编辑</el-button>
            <el-button link type="success" size="small" @click="handleProcess(scope.row)">处理</el-button>
            <el-button link type="success" size="small" @click="handleProcess(scope.row)">处理@</el-button>
            <el-button link type="danger" size="small" @click="handleDelete(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      

      <!-- 分页 -->
      <pagination 
        v-show="total > 0" 
        :total="total" 
      <pagination
        v-show="total > 0"
        :total="total"
        layout="total, sizes, prev, pager, next, jumper"
        :page="page.current" 
        :limit="page.size" 
        @pagination="paginationChange" 
        :page="page.current"
        :limit="page.size"
        @pagination="paginationChange"
      />
    </div>

    <!-- 新增/编辑预警规则弹窗 -->
    <el-dialog 
      v-model="dialogFormVisible" 
      :title="operationType === 'add' ? '新增预警规则' : '编辑预警规则'" 
    <el-dialog
      v-model="dialogFormVisible"
      :title="operationType === 'add' ? '新增预警规则' : '编辑预警规则'"
      width="50%"
      @close="closeDialog"
    >
@@ -158,7 +158,7 @@
            </el-form-item>
          </el-col>
        </el-row>
        

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="储气罐类型：" prop="tankType">
@@ -176,7 +176,7 @@
            </el-form-item>
          </el-col>
        </el-row>
        

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="容积(m³)：" prop="volume">
@@ -189,7 +189,7 @@
            </el-form-item>
          </el-col>
        </el-row>
        

        <!-- 库存相关 -->
        <el-row :gutter="20">
          <el-col :span="12">
@@ -203,7 +203,7 @@
            </el-form-item>
          </el-col>
        </el-row>
        

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="最高气体量(%)：" prop="maxGasLevel">
@@ -216,7 +216,7 @@
            </el-form-item>
          </el-col>
        </el-row>
        

        <!-- 预警规则 -->
        <el-row :gutter="20">
          <el-col :span="12">
@@ -239,7 +239,7 @@
            </el-form-item>
          </el-col>
        </el-row>
        

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="预警阈值：" prop="warningThreshold">
@@ -252,15 +252,15 @@
            </el-form-item>
          </el-col>
        </el-row>
        

        <!-- 时间相关 -->
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="预警时间：" prop="warningTime">
              <el-date-picker 
                v-model="form.warningTime" 
                type="datetime" 
                placeholder="请选择预警时间" 
              <el-date-picker
                v-model="form.warningTime"
                type="datetime"
                placeholder="请选择预警时间"
                style="width: 100%"
                value-format="YYYY-MM-DD HH:mm:ss"
              />
@@ -268,24 +268,24 @@
          </el-col>
          <el-col :span="12">
            <el-form-item label="预计充装时间：" prop="expectedRefillTime">
              <el-date-picker 
                v-model="form.expectedRefillTime" 
                type="datetime" 
                placeholder="请选择预计充装时间" 
              <el-date-picker
                v-model="form.expectedRefillTime"
                type="datetime"
                placeholder="请选择预计充装时间"
                style="width: 100%"
                value-format="YYYY-MM-DD HH:mm:ss"
              />
            </el-form-item>
          </el-col>
        </el-row>
        

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="预计缺气时间：" prop="expectedShortageTime">
              <el-date-picker 
                v-model="form.expectedShortageTime" 
                type="datetime" 
                placeholder="请选择预计缺气时间" 
              <el-date-picker
                v-model="form.expectedShortageTime"
                type="datetime"
                placeholder="请选择预计缺气时间"
                style="width: 100%"
                value-format="YYYY-MM-DD HH:mm:ss"
              />
@@ -293,17 +293,17 @@
          </el-col>
          <el-col :span="12">
            <el-form-item label="预警规则描述：" prop="warningRule">
              <el-input 
                v-model="form.warningRule" 
                type="textarea" 
                :rows="3" 
              <el-input
                v-model="form.warningRule"
                type="textarea"
                :rows="3"
                placeholder="请输入预警规则描述"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      

      <template #footer>
        <div class="dialog-footer">
          <el-button @click="closeDialog">取消</el-button>
@@ -460,19 +460,19 @@
// 获取倒计时信息
const getCountdown = (expectedTime) => {
  if (!expectedTime) return { text: '-', isExpired: false }
  

  const now = new Date().getTime()
  const expected = new Date(expectedTime).getTime()
  const diff = expected - now
  

  if (diff <= 0) {
    return { text: '已缺气', isExpired: true }
  }
  

  const days = Math.floor(diff / (1000 * 60 * 60 * 24))
  const hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))
  const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60))
  

  if (days > 0) {
    return { text: `${days}天${hours}小时`, isExpired: false }
  } else if (hours > 0) {
@@ -485,11 +485,11 @@
// 获取倒计时样式类
const getCountdownClass = (expectedTime) => {
  if (!expectedTime) return ''
  

  const now = new Date().getTime()
  const expected = new Date(expectedTime).getTime()
  const diff = expected - now
  

  if (diff <= 0) {
    return 'countdown-expired'
  } else if (diff <= 24 * 60 * 60 * 1000) { // 24小时内
@@ -519,7 +519,7 @@
const showShortageWarning = (tank) => {
  currentWarningTank.value = tank
  shortageWarningVisible.value = true
  

  // 播放提示音（可选）
  // const audio = new Audio('/path/to/warning-sound.mp3')
  // audio.play()
@@ -642,7 +642,7 @@
    ElMessage.warning('请选择要处理的预警')
    return
  }
  

  try {
    // 模拟API调用延迟
    await new Promise(resolve => setTimeout(resolve, 500))
@@ -725,10 +725,10 @@
const submitForm = async () => {
  try {
    await proxy.$refs.formRef.validate()
    

    // 模拟API调用延迟
    // await new Promise(resolve => setTimeout(resolve, 500))
    

    if (operationType.value === 'add') {
      addStockWarning(form).then(res => {
        if(res.code == 200){
@@ -755,7 +755,7 @@
      })
      // ElMessage.success('编辑成功')
    }
    

    // closeDialog()
    // getList()
  } catch (error) {
@@ -846,89 +846,89 @@
<style scoped lang="scss">
.app-container {
  padding: 20px;
  

  .table-operations {
    text-align: right;
    margin-bottom: 20px;
    

    .el-button {
      margin-right: 10px;
    }
  }
  

  .table_list {
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  }
  

  .text-danger {
    color: #f56c6c;
    font-weight: bold;
  }
  

  .text-warning {
    color: #e6a23c;
    font-weight: bold;
  }
  

  .text-success {
    color: #67c23a;
    font-weight: bold;
  }
  

  .dialog-footer {
    text-align: right;
  }
  

  // 倒计时样式
  .countdown-timer {
    font-weight: bold;
  }
  

  .countdown-normal {
    color: #67c23a;
  }
  

  .countdown-warning {
    color: #e6a23c;
  }
  

  .countdown-urgent {
    color: #f56c6c;
    animation: blink 1s infinite;
  }
  

  .countdown-expired {
    color: #f56c6c;
    font-weight: bold;
  }
  

  @keyframes blink {
    0%, 50% { opacity: 1; }
    51%, 100% { opacity: 0.5; }
  }
  

  // 缺气预警弹框样式
  .shortage-warning-content {
    text-align: center;
    padding: 20px 0;
    

    .warning-icon {
      margin-bottom: 20px;
    }
    

    .warning-message {
      h3 {
        color: #f56c6c;
        margin-bottom: 10px;
      }
      

      p {
        margin-bottom: 10px;
        color: #606266;
      }
      

      .warning-details {
        background: #f5f7fa;
        padding: 15px;