Compare commits

48 Commits

Author SHA1 Message Date
f139835ad4 feat(bpm): 添加处理待阅功能并优化流程实例详情页
- 新增 handleProcessInstanceCC 接口用于处理待阅操作
- 在流程实例详情页初始化时调用待阅处理接口
- 优化页面按钮图标与文字的布局展示
- 调整打印表单相关逻辑及页面结构
- 统一接口请求参数格式并移除多余空格
- 修复表单变量合并逻辑并优化对象展开语法
- 更新组件引用路径及函数调用方式一致性
2025-12-11 17:06:30 +08:00
e5110e624c feat(config): 增加接口请求超时时间配置
- 将默认请求超时时间从30秒调整为300秒
- 保持上传文件接口的特定超时时间为120秒
- 优化导出语句格式以提高代码可读性
2025-12-10 14:49:53 +08:00
chenlin
268645ed62 园区UI优化 2025-12-08 15:49:35 +08:00
chenlin
fc2c0d341f UI优化 2025-12-08 15:48:54 +08:00
0c3a841936 增加抄送 2025-12-08 10:50:25 +08:00
chenlin
2f7436398e 去掉固定 2025-12-05 15:50:28 +08:00
chenlin
4bca8652d6 动环监控大屏 2025-12-03 15:25:06 +08:00
chenlin
685a02ac01 <template>
<div class="big-screen-container">
    <!-- 标题栏 -->
    <div class="screen-header">
      <h1 class="screen-title">动环监控大屏</h1>
      <div class="screen-datetime">{{ currentDateTime }}</div>
    </div>

    <!-- 主要内容区域 -->
    <div class="screen-content">
      <!-- 第一行:统计卡片 -->
      <div class="stats-row">
        <!-- 总设备数卡片 -->
        <div class="stat-card">
          <div class="card-title">总设备数</div>
          <div class="card-value">{{ totalDevices.toLocaleString() }}</div>
          <div class="card-trend growth">
            <svg class="trend-icon" viewBox="0 0 1024 1024" width="16" height="16" fill="currentColor">
              <path d="M868 545.5L536.1 163a31.96 31.96 0 0 0-48.3 0L156 545.5a7.97 7.97 0 0 0 6 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"></path>
            </svg>
            <span>较上月增长 {{ totalDevicesGrowth }}%</span>
          </div>
        </div>

        <!-- 在线设备数卡片 -->
        <div class="stat-card">
          <div class="card-title">在线设备数</div>
          <div class="card-value">{{ onlineDevices.toLocaleString() }}</div>
          <div class="card-trend online-rate">
            <span>在线率 {{ onlineRate }}%</span>
          </div>
        </div>
      </div>

      <!-- 第二行:图表 -->
      <div class="charts-row">
        <!-- 告警趋势折线图 -->
        <div class="chart-card">
          <div class="chart-title">当月告警趋势</div>
          <div ref="alarmTrendChartRef" class="chart-container"></div>
        </div>

        <!-- 设备类型分布饼图 -->
        <div class="chart-card">
          <div class="chart-title">告警设备类型分布</div>
          <div ref="deviceTypePieChartRef" class="chart-container"></div>
        </div>
      </div>

      <!-- 第三行:园区信息列表 -->
      <div class="table-row">
        <div class="table-card">
          <div class="table-title">园区信息列表</div>
          <el-table
            :data="parkList"
            stripe
            style="width: 100%"
            class="park-table"
            height="calc(100% - 50px)"
            :header-cell-style="{
              background: 'rgba(78, 155, 248, 0.08)',
              color: '#ffffff',
              borderBottom: '1px solid rgba(78, 155, 248, 0.15)',
              fontWeight: '500',
              padding: '12px 8px'
            }"
            :row-style="{
              background: 'transparent',
              color: '#ffffff'
            }"
            :cell-style="{
              borderBottom: '1px solid rgba(78, 155, 248, 0.08)',
              color: '#ffffff',
              padding: '12px 8px'
            }"
          >
            <el-table-column prop="parkName" label="园区名称" width="180" align="left" />
            <el-table-column prop="totalDevices" label="设备总数" width="100" align="center">
              <template #default="{ row }">
                <span class="device-count">{{ row.totalDevices }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="upsStatus" label="UPS" width="120" align="center">
              <template #default="{ row }">
                <span :class="['status-text', row.upsStatus === '正常' ? 'status-normal' : 'status-alarm']">
                  {{ row.upsStatus }}
                </span>
              </template>
            </el-table-column>
            <el-table-column prop="airConditionStatus" label="精密空调" width="120" align="center">
              <template #default="{ row }">
                <span :class="['status-text', row.airConditionStatus === '正常' ? 'status-normal' : 'status-alarm']">
                  {{ row.airConditionStatus }}
                </span>
              </template>
            </el-table-column>
            <el-table-column prop="temperatureStatus" label="温湿度" width="120" align="center">
              <template #default="{ row }">
                <span :class="['status-text', row.temperatureStatus === '正常' || typeof row.temperatureStatus === 'number' ? 'status-normal' : 'status-alarm']">
                  {{ row.temperatureStatus }}
                </span>
              </template>
            </el-table-column>
            <el-table-column prop="otherStatus" label="其他" width="120" align="center">
              <template #default="{ row }">
                <span :class="['status-text', row.otherStatus === '正常' ? 'status-normal' : 'status-alarm']">
                  {{ row.otherStatus }}
                </span>
              </template>
            </el-table-column>
            <el-table-column label="详情" width="150" align="center">
              <template #default="{ row }">
                <a
                  :class="['detail-link', row.hasAlarm ? 'detail-alarm' : 'detail-normal']"
                  @click="handleViewDetail(row)"
                >
                  <span v-if="row.hasAlarm" class="alarm-badge">异常</span>
                  <span v-else class="normal-badge">正常</span>
                  查看详情
                </a>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted, onBeforeUnmount } from 'vue';
import * as echarts from 'echarts';
import type { EChartsOption } from 'echarts';

// 定义园区信息类型
interface ParkInfo {
  key: string;
  parkName: string;
  totalDevices: number;
  upsStatus: string;
  airConditionStatus: string;
  temperatureStatus: string | number;
  otherStatus: string;
  hasAlarm: boolean;
}

// 当前日期时间
const currentDateTime = ref('');

// 统计数据
const totalDevices = ref(1286);
const totalDevicesGrowth = ref(5.2);
const onlineDevices = ref(1254);
const onlineRate = ref(97.5);

// 图表引用
const alarmTrendChartRef = ref<HTMLDivElement>();
const deviceTypePieChartRef = ref<HTMLDivElement>();

// 图表实例
let alarmTrendChart: echarts.ECharts | null = null;
let deviceTypePieChart: echarts.ECharts | null = null;

// 告警趋势数据
const alarmTrendData = ref({
  dates: ['5日', '10日', '15日', '20日', '25日', '30日'],
  values: [8, 4, 20, 16, 21, 9]
});

// 设备类型分布数据
const deviceTypeData = ref([
  { name: 'UPS', value: 35 },
  { name: '精密空调', value: 25 },
  { name: '温湿度检测', value: 20 },
  { name: '其他', value: 20 }
]);

// 园区信息列表数据
const parkList = ref<ParkInfo[]>([
  {
    key: '1',
    parkName: '雄安总部',
    totalDevices: 156,
    upsStatus: '3个告警',
    airConditionStatus: '正常',
    temperatureStatus: '正常',
    otherStatus: '正常',
    hasAlarm: true
  },
  {
    key: '2',
    parkName: '恒毅大厦',
    totalDevices: 98,
    upsStatus: '正常',
    airConditionStatus: '正常',
    temperatureStatus: '正常',
    otherStatus: '正常',
    hasAlarm: false
  },
  {
    key: '3',
    parkName: '丰台创新中心',
    totalDevices: 124,
    upsStatus: '正常',
    airConditionStatus: '正常',
    temperatureStatus: 2,
    otherStatus: '正常',
    hasAlarm: false
  },
  {
    key: '4',
    parkName: '重庆产业大厦',
    totalDevices: 92,
    upsStatus: '正常',
    airConditionStatus: '2个告警',
    temperatureStatus: '正常',
    otherStatus: '正常',
    hasAlarm: true
  },
  {
    key: '5',
    parkName: '海南园区',
    totalDevices: 78,
    upsStatus: '正常',
    airConditionStatus: '正常',
    temperatureStatus: '正常',
    otherStatus: '正常',
    hasAlarm: false
  },
  {
    key: '6',
    parkName: '雄安地面站',
    totalDevices: 64,
    upsStatus: '正常',
    airConditionStatus: '正常',
    temperatureStatus: '正常',
    otherStatus: '正常',
    hasAlarm: false
  },
  {
    key: '7',
    parkName: '铜川地面站',
    totalDevices: 58,
    upsStatus: '正常',
    airConditionStatus: '正常',
    temperatureStatus: '正常',
    otherStatus: '正常',
    hasAlarm: false
  },
  {
    key: '8',
    parkName: '佳木斯地面站',
    totalDevices: 72,
    upsStatus: '正常',
    airConditionStatus: '正常',
    temperatureStatus: '正常',
    otherStatus: '正常',
    hasAlarm: false
  },
  {
    key: '9',
    parkName: '库尔勒地面站',
    totalDevices: 68,
    upsStatus: '正常',
    airConditionStatus: '正常',
    temperatureStatus: 1,
    otherStatus: '正常',
    hasAlarm: false
  },
  {
    key: '10',
    parkName: '澄迈地面站',
    totalDevices: 56,
    upsStatus: '正常',
    airConditionStatus: '正常',
    temperatureStatus: '正常',
    otherStatus: '正常',
    hasAlarm: false
  },
  {
    key: '11',
    parkName: '文昌地面站',
    totalDevices: 60,
    upsStatus: '正常',
    airConditionStatus: '正常',
    temperatureStatus: '正常',
    otherStatus: '正常',
    hasAlarm: false
  }
]);

// 更新日期时间
const updateDateTime = () => {
  const now = new Date();
  const year = now.getFullYear();
  const month = String(now.getMonth() + 1).padStart(2, '0');
  const day = String(now.getDate()).padStart(2, '0');
  const hours = String(now.getHours()).padStart(2, '0');
  const minutes = String(now.getMinutes()).padStart(2, '0');
  const seconds = String(now.getSeconds()).padStart(2, '0');
  currentDateTime.value = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
};

// 初始化告警趋势图表
const initAlarmTrendChart = () => {
  if (!alarmTrendChartRef.value) return;

  alarmTrendChart = echarts.init(alarmTrendChartRef.value);

  const option: EChartsOption = {
    grid: {
      top: '15%',
      left: '8%',
      right: '5%',
      bottom: '12%',
      containLabel: true
    },
    xAxis: {
      type: 'category',
      data: alarmTrendData.value.dates,
      axisLine: {
        lineStyle: {
          color: '#3a5165'
        }
      },
      axisLabel: {
        color: '#8b9bb3',
        fontSize: 12
      },
      splitLine: {
        show: true,
        lineStyle: {
          color: '#1e3a52',
          type: 'dashed'
        }
      }
    },
    yAxis: {
      type: 'value',
      min: 0,
      max: 25,
      interval: 5,
      axisLine: {
        show: false
      },
      axisLabel: {
        color: '#8b9bb3',
        fontSize: 12
      },
      splitLine: {
        lineStyle: {
          color: '#1e3a52',
          type: 'dashed'
        }
      }
    },
    series: [
      {
        data: alarmTrendData.value.values,
        type: 'line',
        smooth: true,
        lineStyle: {
          color: '#4e9bf8',
          width: 2
        },
        itemStyle: {
          color: '#4e9bf8',
          borderWidth: 2
        },
        areaStyle: {
          color: {
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
              { offset: 0, color: 'rgba(78, 155, 248, 0.3)' },
              { offset: 1, color: 'rgba(78, 155, 248, 0.05)' }
            ]
          }
        },
        markPoint: {
          symbol: 'circle',
          symbolSize: 8,
          itemStyle: {
            color: '#ff5555',
            borderWidth: 2,
            borderColor: '#ff5555'
          },
          data: [
            { name: '峰值1', coord: [2, 20] }, // 15日的告警峰值
            { name: '峰值2', coord: [4, 21] }  // 25日的告警峰值
          ]
        }
      }
    ]
  };

  alarmTrendChart.setOption(option);
};

// 初始化设备类型分布饼图
const initDeviceTypePieChart = () => {
  if (!deviceTypePieChartRef.value) return;

  deviceTypePieChart = echarts.init(deviceTypePieChartRef.value);

  const total = deviceTypeData.value.reduce((sum, item) => sum + item.value, 0);

  const option: EChartsOption = {
    legend: {
      orient: 'vertical',
      right: '10%',
      top: 'center',
      textStyle: {
        color: '#ffffff',
        fontSize: 13
      },
      formatter: (name: string) => {
        const item = deviceTypeData.value.find(d => d.name === name);
        return `${name} (${item?.value || 0})`;
      }
    },
    series: [
      {
        type: 'pie',
        radius: ['45%', '70%'],
        center: ['35%', '50%'],
        avoidLabelOverlap: false,
        label: {
          show: true,
          position: 'center',
          formatter: () => {
            return `{value|${total}}\n{label|告警}`;
          },
          rich: {
            value: {
              color: '#ffffff',
              fontSize: 28,
              fontWeight: 'bold',
              lineHeight: 40
            },
            label: {
              color: '#8b9bb3',
              fontSize: 14,
              lineHeight: 20
            }
          }
        },
        labelLine: {
          show: false
        },
        data: deviceTypeData.value.map((item, index) => {
          const colors = ['#4e9bf8', '#52c41a', '#fa8c16', '#8c8c8c'];
          return {
            name: item.name,
            value: item.value,
            itemStyle: {
              color: colors[index]
            }
          };
        })
      }
    ]
  };

  deviceTypePieChart.setOption(option);
};

// 查看详情
const handleViewDetail = (record: ParkInfo) => {
  console.log('查看园区详情:', record);
  // TODO: 实现详情页面跳转或弹窗
};

// 定时器
let dateTimeTimer: number | null = null;

// 组件挂载
onMounted(() => {
  // 更新日期时间
  updateDateTime();
  dateTimeTimer = window.setInterval(updateDateTime, 1000);

  // 初始化图表
  setTimeout(() => {
    initAlarmTrendChart();
    initDeviceTypePieChart();
  }, 100);

  // 监听窗口大小变化
  window.addEventListener('resize', handleResize);
});

// 组件卸载
onBeforeUnmount(() => {
  if (dateTimeTimer) {
    clearInterval(dateTimeTimer);
  }
  if (alarmTrendChart) {
    alarmTrendChart.dispose();
  }
  if (deviceTypePieChart) {
    deviceTypePieChart.dispose();
  }
  window.removeEventListener('resize', handleResize);
});

// 处理窗口大小变化
const handleResize = () => {
  alarmTrendChart?.resize();
  deviceTypePieChart?.resize();
};
</script>

<style scoped lang="scss">
.big-screen-container {
  width: 100%;
  min-height: 100vh;
  background: linear-gradient(180deg, #0a1929 0%, #0d1e2f 100%);
  padding: 20px;
  box-sizing: border-box;
  overflow: auto;
}

// 标题栏
.screen-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding: 0 10px;

  .screen-title {
    font-size: 32px;
    font-weight: bold;
    color: #ffffff;
    margin: 0;
    letter-spacing: 2px;
  }

  .screen-datetime {
    font-size: 18px;
    color: #8b9bb3;
    font-family: 'Courier New', monospace;
  }
}

// 主要内容区域
.screen-content {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

// 统计卡片行
.stats-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.stat-card {
  background: linear-gradient(135deg, #1a2940 0%, #0f1e2d 100%);
  border-radius: 12px;
  padding: 30px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(78, 155, 248, 0.1);

  .card-title {
    font-size: 16px;
    color: #8b9bb3;
    margin-bottom: 15px;
  }

  .card-value {
    font-size: 48px;
    font-weight: bold;
    color: #ffffff;
    margin-bottom: 12px;
    font-family: 'Arial', sans-serif;
  }

  .card-trend {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;

    &.growth {
      color: #52c41a;

      .trend-icon {
        width: 16px;
        height: 16px;
        flex-shrink: 0;
      }
    }

    &.online-rate {
      color: #13c2c2;
    }
  }
}

// 图表行
.charts-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.chart-card {
  background: linear-gradient(135deg, #1a2940 0%, #0f1e2d 100%);
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(78, 155, 248, 0.1);
  height: 350px;

  .chart-title {
    font-size: 16px;
    color: #ffffff;
    margin-bottom: 15px;
    font-weight: 500;
  }

  .chart-container {
    width: 100%;
    height: calc(100% - 40px);
  }
}

// 表格行
.table-row {
  width: 100%;
}

.table-card {
  background: linear-gradient(135deg, #1a2940 0%, #0f1e2d 100%);
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(78, 155, 248, 0.1);
  height: 450px;

  .table-title {
    font-size: 16px;
    color: #ffffff;
    margin-bottom: 15px;
    font-weight: 500;
  }

  :deep(.park-table) {
    background: transparent !important;

    // 表格主体背景
    .el-table__inner-wrapper {
      background: transparent !important;

      &::before {
        display: none;
      }
    }

    .el-table__body-wrapper {
      background: transparent !important;

      // 滚动条样式
      scrollbar-width: thin;
      scrollbar-color: rgba(78, 155, 248, 0.3) transparent;

      &::-webkit-scrollbar {
        width: 6px;
      }

      &::-webkit-scrollbar-thumb {
        background: rgba(78, 155, 248, 0.3);
        border-radius: 3px;
      }

      &::-webkit-scrollbar-track {
        background: transparent;
      }
    }

    .el-table__header-wrapper,
    .el-table__footer-wrapper {
      background: transparent !important;
    }

    // 表格行悬浮效果
    .el-table__row {
      &:hover {
        background: rgba(78, 155, 248, 0.05) !important;
      }
    }

    // 空数据样式
    .el-table__empty-block {
      background: transparent !important;

      .el-table__empty-text {
        color: #8b9bb3;
      }
    }

    .device-count {
      color: #ffffff;
      font-weight: 500;
    }

    .status-text {
      padding: 2px 8px;
      border-radius: 4px;
      font-size: 13px;

      &.status-normal {
        color: #52c41a;
      }

      &.status-alarm {
        color: #ff4d4f;
      }
    }

    .detail-link {
      cursor: pointer;
      font-size: 13px;
      display: inline-flex;
      align-items: center;
      gap: 4px;
      text-decoration: none;

      &.detail-normal {
        color: #52c41a;

        .normal-badge {
          color: #52c41a;
        }
      }

      &.detail-alarm {
        .alarm-badge {
          color: #ff4d4f;
        }
      }

      &:hover {
        opacity: 0.8;
      }
    }
  }
}

// 响应式布局
@media screen and (max-width: 1600px) {
  .screen-header {
    .screen-title {
      font-size: 28px;
    }

    .screen-datetime {
      font-size: 16px;
    }
  }

  .stat-card {
    padding: 25px;

    .card-value {
      font-size: 42px;
    }
  }

  .chart-card {
    height: 320px;
  }

  .table-card {
    height: 400px;
  }
}

@media screen and (max-width: 1280px) {
  .screen-header {
    .screen-title {
      font-size: 26px;
    }

    .screen-datetime {
      font-size: 15px;
    }
  }

  .stat-card {
    padding: 20px;

    .card-title {
      font-size: 14px;
    }

    .card-value {
      font-size: 38px;
    }

    .card-trend {
      font-size: 13px;
    }
  }

  .chart-card {
    height: 300px;
    padding: 15px;

    .chart-title {
      font-size: 14px;
    }
  }

  .table-card {
    height: 380px;
    padding: 15px;

    .table-title {
      font-size: 14px;
    }
  }
}

// 仅在非常小的屏幕(小于1024px)才改为单列
@media screen and (max-width: 1024px) {
  .stats-row,
  .charts-row {
    grid-template-columns: 1fr;
  }

  .chart-card {
    height: 280px;
  }

  .table-card {
    height: 360px;
  }
}
</style>
2025-12-03 15:12:18 +08:00
8215478113 table 2025-12-03 15:06:55 +08:00
chenlin
2595f2b8ee Merge branch 'dev' of http://120.46.213.136:9528/isoftstone/lc_frontend into dev 2025-12-03 14:56:00 +08:00
chenlin
c2171db699 动环监控大屏 2025-12-03 14:55:57 +08:00
852ae25cc6 样式调整 2025-12-03 10:23:44 +08:00
chenlin
d393275529 UI优化 2025-11-29 15:34:30 +08:00
chenlin
91966b402e 数据看板优化 2025-11-29 15:20:48 +08:00
chenlin
8b9affd8e8 数据看板开发完成 2025-11-29 14:44:18 +08:00
chenlin
26e1f9a181 数据看板优化 2025-11-27 18:12:53 +08:00
chenlin
9d2ae9b0b4 区域UI开发 2025-11-27 16:07:54 +08:00
2706b4f3ef fix(bpm): 隐藏流程实例详情中的转办和加签按钮
- 注释掉转办按钮及相关功能代码
- 注释掉加签按钮及相关功能代码
- 保留委派按钮功能不变
2025-11-27 11:12:17 +08:00
chenlin
026453ba2a Merge branch 'dev' of http://120.46.213.136:9528/isoftstone/lc_frontend into dev 2025-11-27 09:49:47 +08:00
chenlin
3edfa51d3c 隐藏菜单 2025-11-27 09:49:23 +08:00
bbc5ef3471 Merge remote-tracking branch 'origin/dev' into dev 2025-11-27 08:49:20 +08:00
f5f0b4ac42 fix(bpm): 修复流程实例详情页面按钮显示问题
- 移除了转办按钮的注释标记,使其正常显示
- 调整了加签按钮的注释格式,确保其正确渲染
- 保留了委派和回退按钮的功能实现
2025-11-27 08:49:08 +08:00
chenlin
6fc69bc42a 集团数据看板数据对接 2025-11-26 14:13:02 +08:00
735aa22f95 候选人名称修改 2025-11-21 19:19:52 +08:00
3824642338 Merge branch 'dev' of http://120.46.213.136:9528/isoftstone/lc_frontend into dev 2025-11-21 09:49:41 +08:00
e30b3e3908 样式修改 2025-11-21 09:49:20 +08:00
ec1c68dbc8 fix(bpm): 修正流程实例创建权限标识
- 将按钮权限从 'bpm:process-instance:query' 更正为 'bpm:process-instance:create'
- 确保发起流程功能使用正确的权限控制
2025-11-19 11:18:13 +08:00
973792d196 feat(table): 添加批量同步功能并优化界面图标- 在菜单栏新增“批量同步”按钮,支持一键同步所有未同步表单
-优化多个图标标签的闭合格式,去除多余空格
- 调整部分按钮图标与文字间距样式
- 完善数据源SQL配置、默认排序和搜索按钮的布局结构- 修复部分标签未正确闭合的问题- 统一导入语句及变量解构格式,提升代码可读性- 增加批量同步逻辑,包括查询未同步表单及并发同步处理
- 提供无须同步时的消息提示功能
2025-11-13 19:49:23 +08:00
68594b62b8 fix(bpm): 调整流程实例权限控制逻辑
- 将详情按钮的权限从 cancel 调整为 query
- 取消按钮的显示条件扩展支持 result 为2 的情况
- 取消按钮的权限从 query 调整为 cancel
2025-11-13 10:36:10 +08:00
96edc4e21e 人员持证引入人员不再过滤是否审批 2025-11-12 14:05:46 +08:00
78746d3a2d 部门选择添加内部部门选项 2025-11-11 11:05:33 +08:00
59843de257 feat(screen): 更新区域大屏安全指数获取逻辑并优化界面布局
- 在 mainScreen.vue 和 regionScreen.vue 中新增安全指数独立报表获取逻辑
- 修复 regionScreen.vue 中的模板标签格式和属性换行问题-优化 regionScreen.vue 中的 CSS 背景图片设置和布局结构
- 移除 mainScreen.vue 中未使用的 echarts 日志导入
- 调整多个组件标签的属性排列以提高可读性
-优化 regionScreen.vue 中的数据处理逻辑和查询参数传递方式- 清理 regionScreen.vue 中多余的空行和样式代码
2025-11-06 11:56:15 +08:00
20680032bc feat(screen): 隐藏隐患排查治理标题并调整子标题
- 在 companyScreen.vue 中隐藏“隐患排查治理”标题
- 在 HiddenDangerPanel.vue 中将“分类风险”更改为“隐患等级”
- 在 mainScreenV1.vue 中同步修改标题和子标题显示逻辑
- 在 parkScreen.vue 中隐藏“隐患排查治理”标题
2025-10-31 14:58:49 +08:00
aa5f1f5b9b Merge branch 'dev' of http://120.46.213.136:9528/isoftstone/lc_frontend into dev 2025-10-30 17:12:03 +08:00
6f4be5956e 部门选择 外协单位 选项优化 2025-10-30 17:11:59 +08:00
5d07ca6d0e feat(bpm): 新增任务分配规则支持自定义用户选择
- 在任务分配规则中增加 userSelects 类型支持
- 新增 TaskSelectAssigneeForm 组件用于选择任务候选人
- 更新 UserSelect 组件导出 Column 接口- 调整任务分配表单逻辑以适配新的用户选择类型- 优化任务分配规则获取与展示逻辑
2025-10-30 15:22:30 +08:00
5a1567dc34 feat(bpm): 隐藏流程实例详情中的转办和加签按钮
- 注释掉了任务转办功能按钮
- 注释掉了任务加签功能按钮
-保留了其他操作按钮的功能逻辑
2025-10-27 11:42:55 +08:00
bc9fd221a5 Merge branch 'dev-bpm' into dev 2025-10-27 11:33:44 +08:00
256edf264e feat(bpm): 添加抄送任务流程查看功能
- 在抄送任务列表中增加“流程”按钮,跳转至流程实例详情页
- 调整流程编号字段显示逻辑,默认展示并支持搜索
-优化抄送时间字段格式化方式,并调整搜索类型为时间范围选择
- 禁用规则类型下拉框编辑状态,并默认选中固定值30- 设置任务名称、ID及流程实例名称回填逻辑
2025-10-27 10:37:57 +08:00
7328df959d Revert "放开抄送"
This reverts commit bea6e51eea.
2025-10-23 17:44:30 +08:00
bea6e51eea 放开抄送 2025-10-23 16:46:20 +08:00
d01ce5d4a4 feat(bpm): 新增抄送任务页面并优化流程实例界面
- 新增抄送任务页面,支持查看抄送我的流程任务
-优化流程实例页面UI细节,调整按钮布局和间距
- 完善表单验证规则,确保必填字段校验正确
-修复流程取消功能,支持输入取消原因- 调整代码格式,统一导入语句和对象属性写法- 启用任务抄送按钮,完善审批操作栏功能
2025-10-23 16:29:23 +08:00
28214cade5 Merge branch 'dev' of http://120.46.213.136:9528/isoftstone/lc_frontend into dev 2025-10-21 14:15:56 +08:00
bf81c37459 自定义弹出列表【选择外协人员】 2025-10-21 14:15:51 +08:00
22a49b1d65 feat(document): 添加工作档案标签页
- 在TabsCardDocument组件中新增工作档案标签页配置
- 设置标签页名称为'工作档案'
- 配置标签页对应表单ID为'1966386366515343361'
- 设置计算高度为200像素- 固定搜索条件file_main_type为5
2025-10-20 10:53:20 +08:00
e522bf59a6 增加自定义导出 2025-10-17 16:56:39 +08:00
04e69632f9 推送测试 2025-10-17 11:37:34 +08:00
f8c38c5936 审批info增加滚动条 2025-10-17 11:05:44 +08:00
35 changed files with 7400 additions and 1991 deletions

View File

@@ -63,7 +63,7 @@ watch(
</script>
<template>
<ConfigGlobal :size="currentSize">
<div class="h-100% w-100%" :class="greyMode ? `${prefixCls}-grey-mode` : ''">
<div class="h-100% w-100%" style="overflow-y: auto;" :class="greyMode ? `${prefixCls}-grey-mode` : ''">
<RouterView />
</div>
<routerSearch />

View File

@@ -68,3 +68,7 @@ export const createProcessInstanceCC = async (data) => {
export const getProcessInstanceCCPage = async (params) => {
return await request.get({url: '/bpm/process-instance/cc/my-page', params})
}
export const handleProcessInstanceCC = async (processInstanceId: string) => {
return await request.post({url: '/bpm/process-instance/cc/process-current-user-copy/' + processInstanceId})
}

View File

@@ -1,5 +1,6 @@
import request from '@/config/axios'
import { encryptAES } from '@/components/LowDesign/src/utils/aes'
import download from '@/utils/download'
//获取表单开发列表
export const getDbList = (data) => {
@@ -158,6 +159,11 @@ export const exportExcelData = (tableId, data) => {
return request.download({ url: `/jeelowcode/excel/exportExcel/${tableId}`, method: 'POST', data })
}
//导出Excel表数据
export const exportExcelDataCustom = (explain,tableId, data) => {
return request.download({ url: `/jeelowcode/excel/exportExcelCustom/${tableId}`, method: 'POST', data }).then((data) => download.excel(data, explain, 'xlsx'))
}
//下载导入模板
export const downloadImportTemplate = (tableId) => {
return request.download({ url: `/jeelowcode/excel/exportExcelTemplate/${tableId}` })

121
src/api/index.ts Normal file
View File

@@ -0,0 +1,121 @@
import request from '@/config/axios'
// 获取集团外协管理数据
export const getOutsourcingManagementData = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_wx_jt', data })
}
// 获取集团风险管理数据
export const getRiskManagementData = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_fx_jt', data })
}
// 数据看板-隐患管理-集团(天) /jeelowcode/report-data/list/kb_yh_jt_d
export const getHiddenDangerManagementData = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_yh_jt_d', data })
}
// 数据看板-隐患管理-集团(周) /jeelowcode/report-data/list/kb_yh_jt_w
export const getHiddenDangerManagementDataWeek = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_yh_jt_w', data })
}
// 数据看板-隐患管理-集团(月) /jeelowcode/report-data/list/kb_yh_jt_m
export const getHiddenDangerManagementDataMonth = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_yh_jt_m', data })
}
// 数据看板-高危作业-集团 /jeelowcode/report-data/list/kb_gw_jt
export const getHighRiskManagementData = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_gw_jt', data })
}
// 数据看板-应急预案-集团 /jeelowcode/report-data/list/kb_yj_jt
export const getEmergencyPlanManagementData = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_yj_jt', data })
}
// 数据看板-培训-集团 /jeelowcode/report-data/list/kb_px_jt
export const getTrainingManagementData = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_px_jt', data })
}
// 数据看板-外协管理-区域 /jeelowcode/report-data/list/kb_wx_qy
export const getOutsourcingManagementDataRegion = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_wx_qy', data })
}
// 数据看板-外协管理-园区 /jeelowcode/report-data/list/kb_wx_yq
export const getOutsourcingManagementDataPark = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_wx_yq', data })
}
// 数据看板-风险管理-区域 /jeelowcode/report-data/list/kb_fx_qy
export const getRiskManagementDataRegion = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_fx_qy', data })
}
// 数据看板-风险管理-园区 /jeelowcode/report-data/list/kb_fx_yq
export const getRiskManagementDataPark = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_fx_yq', data })
}
// 数据看板-隐患管理-区域(天) /jeelowcode/report-data/list/kb_yh_qy_d
export const getHiddenDangerManagementDataRegion = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_yh_qy_d', data })
}
// 数据看板-隐患管理-区域(周) /jeelowcode/report-data/list/kb_yh_qy_w
export const getHiddenDangerManagementDataRegionWeek = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_yh_qy_w', data })
}
// 数据看板-隐患管理-区域(月) /jeelowcode/report-data/list/kb_yh_qy_m
export const getHiddenDangerManagementDataRegionMonth = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_yh_qy_m', data })
}
// 数据看板-隐患管理-园区(天)
export const getHiddenDangerManagementDataPark = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_gw_qy_d', data })
}
// 数据看板-隐患管理-园区(周) /jeelowcode/report-data/list/kb_yh_yq_w
export const getHiddenDangerManagementDataParkWeek = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_yh_yq_w', data })
}
// 数据看板-隐患管理-园区(月) /jeelowcode/report-data/list/kb_yh_yq_m
export const getHiddenDangerManagementDataParkMonth = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_yh_yq_m', data })
}
// 数据看板-高危作业-区域 /jeelowcode/report-data/list/kb_gw_dq
export const getHighRiskManagementDataRegion = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_gw_dq', data })
}
// 数据看板-高危作业-园区 /jeelowcode/report-data/list/kb_gw_yq
export const getHighRiskManagementDataPark = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_gw_yq', data })
}
// 数据看板-应急预案-区域 /jeelowcode/report-data/list/kb_yj_dq
export const getEmergencyPlanManagementDataRegion = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_yj_dq', data })
}
// 数据看板-应急预案-园区 /jeelowcode/report-data/list/kb_yj_yq
export const getEmergencyPlanManagementDataPark = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_yj_yq', data })
}
// 数据看板-安全培训-区域 /jeelowcode/report-data/list/kb_px_qy
export const getTrainingManagementDataRegion = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_px_qy', data })
}
// 数据看板-安全培训-园区 /jeelowcode/report-data/list/kb_px_yq
export const getTrainingManagementDataPark = (data) => {
return request.post({ url: '/jeelowcode/report-data/list/kb_px_yq', data })
}

View File

@@ -0,0 +1,3 @@
<svg class="trend-icon" viewBox="0 0 1024 1024" width="16" height="16" fill="currentColor">
<path d="M868 545.5L536.1 163a31.96 31.96 0 0 0-48.3 0L156 545.5a7.97 7.97 0 0 0 6 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"></path>
</svg>

After

Width:  |  Height:  |  Size: 369 B

View File

@@ -0,0 +1,107 @@
<template>
<ContentWrap>
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="80px">
<div v-for="taskAssignRule in props?.taskAssignRules" :key="taskAssignRule.taskDefinitionKey">
<el-divider content-position="left">审批节点{{ taskAssignRule?.taskDefinitionName }}</el-divider>
<el-form-item :label="'候选人'"
:prop="taskAssignRule.taskDefinitionKey"
label-width="122">
<UserSelect
v-model="formData[taskAssignRule.taskDefinitionKey]"
:column="userSelectColumn"
:prop="taskAssignRule.taskDefinitionKey"
type="edit"
:func="(value)=>{console.log(JSON.stringify(value))}"
>
</UserSelect>
</el-form-item>
</div>
</el-form>
</ContentWrap>
</template>
<script lang="ts" setup>
// 从 UserSelect 组件导入 Column 类型
import type {Column} from '@/components/LowDesign/src/shareControl/UserSelect.vue'
// 定义组件选项
defineOptions({
name: "BpmTaskSelectAssigneeForm"
})
interface TaskAssignRule {
id: number
modelId: string
processDefinitionId: string
taskDefinitionKey: string
taskDefinitionName: string
type: number
options: number[]
}
const props = defineProps<{
taskAssignRules: TaskAssignRule[]
modelValue: {}
}>()
const formRef = ref()
const formData = ref(props.modelValue)
const formRules = ref({})
const userSelectColumn: Column = {
label: '候选人',
findType: 'all',
multiple: false,
columnKey: ['sex', 'post', 'deptName']
}
const emit = defineEmits(['updateModelValue'])
watch(
() => props.modelValue,
(val: {}) => {
formData.value = val
},
{
deep: true,
immediate: true,
}
)
watch(
() => formData.value,
(val: {}) => {
emit('updateModelValue', val)
},
{
deep: true,
immediate: true,
}
)
const validateAssignee = (successCallBack: () => void, failCallback: () => void) => {
formRef.value.validate((valid: boolean) => {
if (valid) successCallBack()
else failCallback()
})
}
defineExpose({validateAssignee})
// 初始化 formData
onMounted(() => {
if (props.taskAssignRules) {
props.taskAssignRules.forEach(rule => {
formData.value[rule.taskDefinitionKey] = ''
formRules.value[rule.taskDefinitionKey] = [
{
required: true,
message: '请选择候选人',
trigger: 'blur'
}
]
})
}
})
</script>

View File

@@ -18,6 +18,18 @@
v-bind="userVBind"
class="w-100%"
></userSelect>
</span>
<span prop="delegateDictId" style="display:none">
<DicTableSelect
id="costomDictSelect"
:column="distSelectColumn"
size="default"
type="add"
prop="fields_7897245"
:scope="dictSelectScope"
@set-form-data="handleSetFormData"
></DicTableSelect>
</span>
<!-- 顶部统计 -->
<div
@@ -383,12 +395,108 @@ interface Props {
dicRowKey?: string //dicTable模式 行数据的 Key
}
const dictSelectScope = {
"key": 0,
"value": "",
"column": {
"type": "dicTableSelect",
"controlType": "select",
"label": "表格选择框",
// "fixedSearch":{
// "approveStatusName":"已审批"
// },
"separator": " | ",
"multiple": true,
"display": true,
"span": 12,
"disabled": false,
"required": false,
"hideLabel": false,
"i18nCode": "fields_7897245",
"dictTable": "1959187451673116674",
"dictCode": "id",
"dictText": "personName",
"dictTableColumn": [
"personName",
"personAge",
"personSex",
"mobile",
"approveStatusName"
],
"prop": "fields_7897245",
"dataType": "string",
"className": "control-dicTableSelect control-fields_7897245 ",
"props": {
"lable": "personName",
"value": "id"
},
"rules": [
]
},
"size": "default",
"disabled": false
}
const distSelectColumn = {
"type": "dicTableSelect",
"controlType": "select",
"multiple": true,
"label": "表格选择框",
"separator": " | ",
"display": true,
"span": 12,
"disabled": false,
// "fixedSearch":{
// "approveStatusName":"已审批"
// },
"required": false,
"hideLabel": false,
"i18nCode": "fields_7897245",
"dictTable": "1959187451673116674",
"dictCode": "id",
"dictText": "personName",
"dictTableColumn": [
"personName",
"personAge",
"personSex",
"mobile",
"approveStatusName"
]
,
"prop": "fields_7897245",
"dataType": "string",
"className": "control-dicTableSelect control-fields_7897245 ",
"props": {
"lable": "personName",
"value": "id"
},
"rules": [
]
}
const props = withDefaults(defineProps<Props>(), {
model: 'default',
fixedSearch: () => {
return {}
}
})
const handleSetFormData = (key, val) => {
const cleaned = val.split('|').map(s => s.trim()).join(','); // "1975577437793124352 | 1965778349088899074"
console.log(cleaned);
// 在这里添加其他处理逻辑
useFun.requestApi('get', '/jeelowcode/outsidePerson/importOutside?tableId='+props.tableId+'&ids=' + cleaned, {
}).then(res => {
if (res.length > 0) {
message.success('下发成功')
useFun.refreshChange()
} else {
message.error(res.message)
}
})
};
const userVBind = {
prop: 'delegateUserId',
type: 'edit',
@@ -440,6 +548,17 @@ const userVBind = {
}else if(props.tableId=='1968562717683908610'){ // 考试计划
useFun.requestApi('get', '/jeelowcode/examIssus/addRecord?tableId='+props.tableId+'&ids=' + ids+'&userIds='+resultValue, {
}).then(res => {
if (res.length > 0) {
message.success('下发成功')
useFun.refreshChange()
} else {
message.error(res.message)
}
})
}else if(props.tableId=='1983351353033953281'){ // 工作事项
useFun.requestApi('get', '/jeelowcode/itemIssus/addResult?tableId='+props.tableId+'&ids=' + ids+'&userIds='+resultValue, {
}).then(res => {
if (res.length > 0) {
message.success('下发成功')

View File

@@ -1,5 +1,6 @@
<template>
<div class="dic-table-select-box w-100%">
{{ JSON.stringify(props) }}
<div
class="table-input pos-relative"
:class="[{ disabled }, type, size]"
@@ -273,9 +274,9 @@ const getCurrTableSelect = (type?) => {
const dicObj = {}
const textList: string[] = []
const ids = tableRef.value.tableSelect.map((item) => {
if (item[props.column.dictText]) {
dicObj[item[dicCode.value]] = item[props.column.dictText]
textList.push(item[props.column.dictText])
if (item[props.column.dictCode]) {
dicObj[item[dicCode.value]] = item[props.column.dictCode]
textList.push(item[props.column.dictCode])
}
return item[dicCode.value]
})

View File

@@ -217,7 +217,7 @@ defineOptions({ name: 'UserSelect' })
* all_sub 所有下级
*/
interface Column {
export interface Column {
label: string
findType: 'all' | 'now' | 'sub' | 'all_sub' | 'direct_sub' //查询类型
columnKey: Array<'mobile' | 'email' | 'sex' | 'post' | 'deptName'> //扩展显示列

View File

@@ -34,7 +34,7 @@ const dicObj = {
{ label: '邮箱', value: 'email' }, { label: '性别', value: 'sex' }, { label: '岗位', value: 'post' }, { label: '部门', value: 'deptName' }
],
userFindType: [{ label: '全部用户', value: 'all' }, { label: '本级用户', value: 'now' }, { label: '本级及下级用户', value: 'sub' }],
deptFindType: [{ label: '全部部门', value: 'all' }, { label: '本级部门', value: 'now' }, { label: '本级及下级部门', value: 'sub' }],
deptFindType: [{ label: '全部部门', value: 'all' }, { label: '本级部门', value: 'now' }, { label: '本级及下级部门', value: 'sub' }, { label: '外协单位', value: 'out' }, { label: '内部单位', value: 'internal' }],
customControlType: [{ label: '未全局注册', value: false }, { label: '已全局注册', value: true }],
regionType: [{ label: '全球-国家', value: 'gj' }, { label: '中国-省市区', value: 'ssq' }, { label: '中国-省市', value: 'ss' }, { label: '中国-省', value: 's' }],
dictTextFormatter: [

View File

@@ -7,6 +7,7 @@ import { encryptAES, decryptAES } from '@/components/LowDesign/src/utils/aes'
import { useUserStoreWithOut } from '@/store/modules/user'
import { useI18n } from '@/hooks/web/useI18n';
import router from '@/router/index'
import {exportExcelDataCustom} from '@/api/design/table'
const message = useMessage() // 消息弹窗
@@ -18,6 +19,7 @@ export default {
* @param options 请求配置 如:{ params:{ text:'测试' } }
*/
requestApi: (Method, url, options) => callApiFun(Method, url, options),
exportExcelCustom: (tableId, data) => exportExcelDataCustom(tableId, data),
cloneDeep, //深拷贝
listToTree,//列表转树结构
formatDate,//时间格式化

View File

@@ -546,13 +546,15 @@ export const formDataFormatting = (formOption, formData, formType) => {
echoObj[dicKey].push(...data[key].split(','))
}
} else echoObj[type].push(...data[key].split(','))
} else if (column[key]?.controlType == 'date') {
} else if (column[key]?.controlType == 'date'||key=='create_time') {
if (data[key]) {
if (typeof data[key] == 'number' || typeof data[key] == 'string') {
data[key] = data[key] + ''
if (!(/[-|\/]/g.test(data[key]))) {
//如果是时间戳强制转换
data[key] = formatDate(new Date(data[key]), column[key].valueFormat || 'YYYY-MM-DD HH:mm:ss')
const timestamp = parseInt(data[key], 10)
data[key] = formatDate(new Date(timestamp), column[key].valueFormat || 'YYYY-MM-DD HH:mm:ss')
}
}
}

View File

@@ -16,7 +16,7 @@ const config: {
/**
* 接口请求超时时间
*/
request_timeout: 30000,
request_timeout: 300000,
/**
* 默认接口请求类型

View File

@@ -7,7 +7,8 @@ import {
MapChart,
PictorialBarChart,
RadarChart,
GaugeChart
GaugeChart,
CandlestickChart
} from 'echarts/charts'
import {
@@ -41,7 +42,8 @@ echarts.use([
CanvasRenderer,
PictorialBarChart,
RadarChart,
GaugeChart
GaugeChart,
CandlestickChart
])
export default echarts

View File

@@ -57,6 +57,17 @@ const remainingRouter: AppRouteRecordRaw[] = [
name: 'Home',
meta: {},
children: [
// {
// path: 'index',
// component: () => import('@/views/Home/Index10.vue'),
// name: 'Index',
// meta: {
// title: t('router.home'),
// icon: 'ep:home-filled',
// noCache: false,
// affix: true
// }
// },
{
path: 'index',
component: () => import('@/views/Home/Index10.vue'),
@@ -67,6 +78,30 @@ const remainingRouter: AppRouteRecordRaw[] = [
noCache: false,
affix: true
}
},
{
path: 'region', // 区域数据看板
component: () => import('@/views/Home/Index12.vue'),
name: 'RegionIndex',
meta: {
title: '区域视角数据看板',
icon: 'ep:home-filled',
noCache: false,
hidden: true,
affix: false
}
},
{
path: 'park', // 园区数据看板
component: () => import('@/views/Home/Index13.vue'),
name: 'ParkIndex',
meta: {
title: '园区视角数据看板',
icon: 'ep:home-filled',
hidden: true,
noCache: false,
affix: false
}
}
]
},
@@ -364,6 +399,17 @@ const remainingRouter: AppRouteRecordRaw[] = [
catalogue: true,
}
},
{
path: '/screen/powerMonitoring',
component: () => import('@/views/screen/powerMonitoring.vue'),
name: 'powerMonitoring',
meta: {
hidden: true,
title: '动环监控大屏',
noTagsView: true,
catalogue: true,
}
},
{
path: '/screen/main',
component: () => import('@/views/screen/mainScreen.vue'),

File diff suppressed because it is too large Load Diff

1932
src/views/Home/Index12.vue Normal file

File diff suppressed because it is too large Load Diff

1888
src/views/Home/Index13.vue Normal file

File diff suppressed because it is too large Load Diff

View File

@@ -1,14 +1,6 @@
<template>
<el-form
v-show="getShow"
ref="formLogin"
:model="loginData.loginForm"
:rules="LoginRules"
class="login-form login-form-default"
label-position="top"
label-width="120px"
size="large"
>
<el-form v-show="getShow" ref="formLogin" :model="loginData.loginForm" :rules="LoginRules"
class="login-form login-form-default" label-position="top" label-width="120px" size="large">
<el-row style="margin-right: -10px; margin-left: -10px">
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item>
@@ -17,40 +9,23 @@
</el-col>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item v-if="loginData.tenantEnable === 'true'" prop="tenantName">
<el-input
v-model="loginData.loginForm.tenantName"
:placeholder="t('login.tenantNamePlaceholder')"
:prefix-icon="iconHouse"
link
type="primary"
/>
<el-input v-model="loginData.loginForm.tenantName" :placeholder="t('login.tenantNamePlaceholder')"
:prefix-icon="iconHouse" link type="primary" />
</el-form-item>
</el-col>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item prop="username">
<el-input
v-model="loginData.loginForm.username"
:placeholder="t('login.usernamePlaceholder')"
:prefix-icon="iconAvatar"
/>
<el-input v-model="loginData.loginForm.username" :placeholder="t('login.usernamePlaceholder')"
:prefix-icon="iconAvatar" />
</el-form-item>
</el-col>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item prop="password">
<el-input
v-model="loginData.loginForm.password"
:placeholder="t('login.passwordPlaceholder')"
:prefix-icon="iconLock"
show-password
type="password"
@keyup.enter="getCode()"
/>
<el-input v-model="loginData.loginForm.password" :placeholder="t('login.passwordPlaceholder')"
:prefix-icon="iconLock" show-password type="password" @keyup.enter="getCode()" />
</el-form-item>
</el-col>
<el-col
:span="24"
style="padding-right: 10px; padding-left: 10px; margin-top: -20px; margin-bottom: -20px"
>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px; margin-top: -20px; margin-bottom: -20px">
<el-form-item>
<el-row justify="space-between" style="width: 100%">
<el-col :span="6">
@@ -66,13 +41,8 @@
</el-col>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px" class="login-btn-col">
<el-form-item>
<XButton
:loading="loginLoading"
:title="t('login.login')"
class="w-[100%]"
type="primary"
@click="getCode()"
/>
<XButton :loading="loginLoading" :title="t('login.login')" class="w-[100%]" type="primary"
@click="getCode()" />
<div v-if="loginType == 'easy'" class="w-100% mt-6px flex justify-end">
<el-dropdown @command="easyCommand">
<div class="mt--2px cursor-pointer">
@@ -95,13 +65,8 @@
</div>
</el-form-item>
</el-col>
<Verify
ref="verify"
:captchaType="captchaType"
:imgSize="{ width: '400px', height: '200px' }"
mode="pop"
@success="handleLogin"
/>
<Verify ref="verify" :captchaType="captchaType" :imgSize="{ width: '400px', height: '200px' }" mode="pop"
@success="handleLogin" />
<template v-if="!loginType">
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<!-- <el-form-item>
@@ -127,15 +92,8 @@
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item>
<div class="w-[100%] flex justify-center">
<Icon
v-for="(item, key) in socialList"
:key="key"
:icon="item.icon"
:size="50"
class="anticon cursor-pointer"
color="#999"
@click="doSocialLogin(item.type)"
/>
<Icon v-for="(item, key) in socialList" :key="key" :icon="item.icon" :size="50"
class="anticon cursor-pointer" color="#999" @click="doSocialLogin(item.type)" />
</div>
</el-form-item>
</el-col>
@@ -310,7 +268,12 @@ const handleLogin = async (params) => {
} else {
push({ path: redirect.value || permissionStore.addRouters[0].path })
}
} finally {
}
catch (e) {
loginLoading.value = false
loading.value?.close()
}
finally {
loginLoading.value = false
loading.value?.close()
}

View File

@@ -14,7 +14,7 @@
<el-input v-model="formData.processInstanceKey" disabled placeholder="请输入流程标识" />
</el-form-item>
<el-form-item label="规则类型" prop="type">
<el-select v-model="formData.type" clearable style="width: 100%">
<el-select v-model="formData.type" clearable style="width: 100%" disabled>
<el-option
v-for="dict in getIntDictOptions(DICT_TYPE.BPM_TASK_ASSIGN_RULE_TYPE)"
:key="dict.value"
@@ -165,7 +165,7 @@ const open = async (row) => {
resetForm()
// 2. 再设置表单
if (row != null) {
formData.value.type = undefined as unknown as number
formData.value.type = 30
formData.value.taskName = row.name
formData.value.taskId = row.id
formData.value.processInstanceName = row.processInstance.name

View File

@@ -41,18 +41,20 @@
<Icon icon="ep:close"/>
不通过
</el-button>
<el-button type="primary" @click="openTaskUpdateAssigneeForm(item.id)">
<Icon icon="ep:edit" />
转办
<el-button type="primary" @click="handleCC(item)">
<Icon icon="ep:position"/>
抄送
</el-button>
<el-button type="primary" @click="handleDelegate(item)">
<!-- <el-button type="primary" @click="handleDelegate(item)">
<Icon icon="ep:position" />
委派
</el-button>
<el-button type="primary" @click="handleSign(item)">
<Icon icon="ep:plus" />
加签
</el-button>
</el-button> -->
<el-button type="warning" @click="handleBack(item)">
<Icon icon="ep:back"/>
回退
@@ -102,6 +104,7 @@
<TaskDelegateForm ref="taskDelegateForm" @success="getDetail"/>
<!-- 加签当前任务审批人为A向前加签选了一个C则需要C先审批然后再是A审批向后加签BA审批完需要B再审批完才算完成这个任务节点 -->
<TaskAddSignDialogForm ref="taskAddSignDialogForm" @success="getDetail"/>
<TaskCCDialogForm ref="taskCCDialogForm"/>
</ContentWrap>
</template>
<script lang="ts" setup>
@@ -119,6 +122,7 @@ import { registerComponent } from '@/utils/routerHelper'
import {isEmpty} from '@/utils/is'
import router from '@/router/index'
import {$Print} from '@smallwei/avue'
import TaskCCDialogForm from '../../processInstance/detail/TaskCCDialogForm.vue'
defineOptions({name: 'BpmProcessInstanceDetail'})
@@ -128,6 +132,7 @@ const { proxy } = getCurrentInstance() as any
const userId = useUserStore().getUser.id // 当前登录的编号
const id = query.id as unknown as number // 流程实例的编号
const read = query.read as unknown as boolean // 是否是待阅的标记
const processInstanceLoading = ref(false) // 流程实例的加载中
const processInstance = ref<any>({}) // 流程实例
const bpmnXML = ref('') // BPMN XML
@@ -173,9 +178,17 @@ const handleAudit = async (task, pass) => {
getDetail()
}
const taskCCDialogForm = ref()
/** 处理抄送按钮 */
const handleCC = (row) => {
taskCCDialogForm.value.open(row)
}
const printPage = async () => {
const { href } = router.resolve({ name: 'BpmProcessInstanceInfo',
const {href} = router.resolve({
name: 'BpmProcessInstanceInfo',
query: {id: String(id), isPrint: '1'}
})
window.open(href, '_blank', 'noopener,noreferrer')
@@ -206,6 +219,15 @@ const handleSign = async (task) => {
taskAddSignDialogForm.value.open(task.id)
}
// 处理待阅的操作
const handleRead = async () => {
if (read) {
// 向后端发送接口,让后端发起已阅接口
const data = await ProcessInstanceApi.handleProcessInstanceCC(id + '')
console.log(JSON.stringify(data))
}
}
/** 获得详情 */
const getDetail = () => {
// 1. 获得流程实例相关
@@ -231,6 +253,10 @@ const getProcessInstance = async () => {
if (processDefinition.formType === 10) {
detailForm.value.formId = processDefinition.formId
detailForm.value.optionsData = JSON.parse(processDefinition.formConf)
if (data.formVariables.jeelowcode_subtable_data) {
data.formVariables = {...data.formVariables, ...data.formVariables.jeelowcode_subtable_data}
delete data.formVariables.jeelowcode_subtable_data
}
detailForm.value.defaultData = data.formVariables
// setConfAndFields2(
// detailForm,
@@ -317,6 +343,7 @@ const loadRunningTask = (tasks) => {
/** 初始化 */
onMounted(async () => {
await handleRead()
await getDetail()
await nextTick()
if (query.isPrint === '1') {

View File

@@ -38,8 +38,9 @@
/>
</template>
<template #menu-left>
<el-button type="primary" v-hasPermi="['bpm:process-instance:query']" @click="handleCreate">
<Icon icon="ep:plus" class="mr-5px" /> 发起流程
<el-button type="primary" v-hasPermi="['bpm:process-instance:create']" @click="handleCreate">
<Icon icon="ep:plus" class="mr-5px"/>
发起流程
</el-button>
</template>
<!-- 自定义操作栏 -->
@@ -47,20 +48,20 @@
<el-button
link
type="primary"
v-hasPermi="['bpm:process-instance:cancel']"
v-hasPermi="['bpm:process-instance:query']"
@click="handleDetail(row)"
>
详情
</el-button>
<!-- <el-button
<el-button
link
type="danger"
v-if="row.result === 1"
v-hasPermi="['bpm:process-instance:query']"
v-if="row.result === 1|| row.result === 2"
v-hasPermi="['bpm:process-instance:cancel']"
@click="handleCancel(row)"
>
取消
</el-button> -->
</el-button>
</template>
</avue-crud>
</ContentWrap>
@@ -203,7 +204,8 @@ const searchChange = (params, done) => {
/** 清空按钮操作 */
const resetChange = () => {
searchChange({}, () => {})
searchChange({}, () => {
})
}
const sizeChange = (pageSize) => {

View File

@@ -0,0 +1,175 @@
<!-- 工作流抄送我的流程 -->
<template>
<ContentWrap>
<avue-crud
ref="crudRef"
v-model="tableForm"
v-model:page="tablePage"
v-model:search="tableSearch"
:data="tableData"
:option="tableOption"
:permission="permission"
@search-change="searchChange"
@search-reset="resetChange"
@refresh-change="getTableData"
@size-change="sizeChange"
@current-change="currentChange"
>
<template #menu="{ row }">
<el-button link type="primary" @click="handleAudit(row)">流程</el-button>
</template>
</avue-crud>
</ContentWrap>
</template>
<script lang="ts" setup>
import {dateFormatter} from '@/utils/formatTime'
import * as ProcessInstanceApi from '@/api/bpm/processInstance'
defineOptions({
name: 'BpmCopyTask'
})
// 路由
const {push} = useRouter()
// 列表的加载中
const loading = ref(true)
const {getCurrPermi} = useCrudPermi()
// 表格的配置
const tableOption = reactive({
addBtn: false,
editBtn: false,
delBtn: false,
viewBtn: true,
viewBtnText: '详情',
viewBtnIcon: 'none',
align: 'center',
headerAlign: 'center',
searchMenuSpan: 6,
searchMenuPosition: 'left',
labelSuffix: ' ',
span: 24,
dialogWidth: '50%',
column: {
taskId: {
label: '任务编号'
},
taskName: {
label: '任务名称'
},
processInstanceId: {
label: '流程编号',
search: true,
},
processInstanceName: {
label: '所属流程',
search: true,
},
startUserNickname: {
label: '流程发起人',
},
reason: {
label: '抄送原因'
},
creatorNickname: {
label: '抄送人'
},
createTime: {
label: '抄送时间',
type: 'datetime',
width: 180,
formatter: (row: any, value: any, rowv: any, column: any) => {
return dateFormatter(row, column, value)
}
},
searchCreateTime: {
label: '抄送时间',
display: false,
hide: true,
search: true,
searchType: 'datetimerange',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
startPlaceholder: '开始时间',
endPlaceholder: '结束时间',
searchRange: true,
}
}
})
const tableForm = ref<any>({})
const tableData = ref([])
const tableSearch = ref<any>({})
const tablePage = ref({
currentPage: 1,
pageSize: 10,
total: 0
})
const permission = getCurrPermi(['bpm:task'])
const crudRef = ref()
useCrudHeight(crudRef)
const getTableData = async () => {
// 列表的加载中...
loading.value = true
// 拼接查询参数
let searchObj = {
...tableSearch.value,
pageNo: tablePage.value.currentPage,
pageSize: tablePage.value.pageSize
}
// 处理时间参数,如果为空则去掉这个属性
if (!searchObj.createTime?.length) delete searchObj.createTime
// 去掉空字符串属性
for (let key in searchObj) if (searchObj[key] === '') delete searchObj[key]
// 请求我的待阅数据
try {
const data = await ProcessInstanceApi.getProcessInstanceCCPage(searchObj)
tableData.value = data.list
tablePage.value.total = data.total
} finally {
// 无论请求成功或者失败,这里都需要将加载中关闭
loading.value = false
}
}
const searchChange = (params: any, done: any) => {
tablePage.value.currentPage = 1
// 获取数据
getTableData().finally(() => done())
}
const resetChange = () => {
searchChange({}, () => {
})
}
const sizeChange = (pageSize) => {
tablePage.value.pageSize = pageSize
resetChange()
}
const currentChange = (currentPage) => {
tablePage.value.currentPage = currentPage
getTableData()
}
const handleAudit = (row: any) => {
push({
name: 'BpmProcessInstanceDetail',
query: {
id: row.processInstanceId
}
})
}
/** 初始化 **/
onMounted(async () => {
await getTableData()
})
</script>

View File

@@ -26,7 +26,7 @@
</template>
<template #menu="{ row }">
<el-button link type="primary" @click="handleAudit(row)">审批</el-button>
<!-- <el-button link type="primary" @click="handleCC(row)">抄送</el-button>-->
<el-button link type="primary" @click="handleCC(row)">抄送</el-button>
</template>
</avue-crud>
<TaskCCDialogForm ref="taskCCDialogForm" />

View File

@@ -65,6 +65,7 @@ const getUserKey = (val) => {
else if ([20, 21].includes(val)) key = 'deptIds'
else if (val == 22) key = 'postIds'
else if ([30, 31, 32].includes(val)) key = 'userIds'
else if (val == 35) key = 'userSelects'
else if (val == 40) key = 'userGroupIds'
else if (val == 50) key = 'scripts'
return key
@@ -95,7 +96,8 @@ const tableOption = reactive({
postIds: {display: false},
userIds: {display: false},
userGroupIds: {display: false},
scripts: { display: false }
scripts: {display: false},
userSelects: {display: false},
}
const key = getUserKey(val)
if (key) columnObj[key].display = true
@@ -112,6 +114,7 @@ const tableOption = reactive({
let arr = row.options.map((id) => {
if (key == 'deptIds') return lowStore.dicObj.deptSelect?.[id] || id
else if (key == 'userIds') return lowStore.dicObj.userSelect?.[id] || id
else if (key == 'userSelects') return ''
else return dicObj.value[key][id]
})
@@ -198,7 +201,7 @@ const rowUpdate = async (form, index, done, loading) => {
const delKey = ['roleIds', 'deptIds', 'postIds', 'userIds', 'userGroupIds', 'scripts']
if (key) {
if (typeof form[key] == 'number') form[key] = form[key] + ''
const value = form[key]
const value = key === 'userSelects' ? '' : form[key]
form.options = typeof value == 'string' ? value.split(',') : value
}
delKey.forEach((prop) => delete form[prop])

View File

@@ -61,6 +61,13 @@ const tabsPaneList = ref([
calcHeight: 200,
fixedSearch: {file_main_type: 4}
},
{
label: '工作档案',
name: 'workArchive',
formId: '1966386366515343361',
calcHeight: 200,
fixedSearch: {file_main_type: 5}
},
])
// 定义点击tab的事件动作

View File

@@ -86,6 +86,17 @@
<Icon :size="14" icon="hugeicons:java"/>
<span class="ml-3px!">JAVA增强</span>
</el-button>
<!-- 批量同步 -->
<el-button
type="primary"
:size="size"
@click="handleBatchSync"
v-hasPermi="['jeelowcode:dbform:sync']"
>
<Icon :size="14" icon="simple-icons:oracle"/>
<span class="ml-3px!">批量同步</span>
</el-button>
</template>
<template #menu="{ size, row }">
<div class="flex justify-center flex-items-center">
@@ -190,7 +201,8 @@
@click="openDataOrigin"
:disabled="!tableForm.dataOrigin"
>
<Icon :size="14" icon="lucide:text-search"></Icon> <span>数据源SQL配置</span>
<Icon :size="14" icon="lucide:text-search"></Icon>
<span>数据源SQL配置</span>
</el-button>
<el-button
type="primary"
@@ -211,10 +223,12 @@
<span>表格扩展配置</span>
</el-button>
<el-button @click="sortPopup = true">
<Icon :size="14" icon="mdi:sort"></Icon> <span>默认排序</span>
<Icon :size="14" icon="mdi:sort"></Icon>
<span>默认排序</span>
</el-button>
<el-button @click="searchPopup = true">
<Icon :size="14" icon="lucide:text-search"></Icon> <span>默认搜索</span>
<Icon :size="14" icon="lucide:text-search"></Icon>
<span>默认搜索</span>
</el-button>
</div>
</template>
@@ -417,7 +431,8 @@
size="small"
type="primary"
@click="copySampleStr(key)"
>点击复制</el-button
>点击复制
</el-button
>
</div>
</div>
@@ -1524,7 +1539,8 @@ const searchChange = (params, done) => {
/** 清空按钮操作 */
const resetChange = () => {
searchChange({}, () => {})
searchChange({}, () => {
})
}
const sizeChange = (pageSize) => {
@@ -1738,13 +1754,35 @@ const rowDel = async (form) => {
message.success(t('common.delSuccess'))
// 刷新列表
await getTableData()
} catch {}
} catch {
}
}
const beforeUnload = (event) => {
if (isUnload.value) return (event.returnValue = '您确定要关闭页面吗?')
}
/** 批量同步 **/
const handleBatchSync = async () => {
// 首先需要查询有没有需要同步的表单,如果没有则提示消息并结束,如果有则打开弹窗
let searchObj = {
isDbSync: 'N',
pageNo: tablePage.value.currentPage,
pageSize: -1
}
const data = await TableApi.getDbList(searchObj)
if (data?.records?.length > 0) {
// 将data.records取出来每个记录的id作为row.id并且发起普通同步
const promises = data.records.map((row) => TableApi.asyncDbData(row.id, 'default'))
await Promise.all(promises).catch(() => message.alert('同步失败'))
// 刷新列表
getTableData()
} else {
// 没有需要同步的表单,提示信息并结束方法
message.info('没有需要同步的表单')
}
}
/** 初始化 **/
onMounted(async () => {
window.addEventListener('beforeunload', beforeUnload)

View File

@@ -70,7 +70,8 @@
</div>
<div class="bottom-card">
<div class="bottom-card-title">
<span>隐患排查治理</span>
<!-- 隐患排查治理 标题需要隐藏 2025-10-31 -->
<span></span>
<img width="50%" style="margin: 8px 0" src="@/assets/images/line_1.png" />
</div>
<div class="type-wrapper">

View File

@@ -1,9 +1,10 @@
<template>
<div class="center-container">
<div class="center-content">
<span class="title">隐患排查治理</span>
<!-- 隐患排查治理 这个标题需要隐藏 2025-10-31 -->
<span class="title"></span>
<img class="bottom-border-line" src="@/assets/images/title_border_line_1.png" />
<span class="sub-title">分类风险</span>
<span class="sub-title">隐患等级</span>
<img width="50%" src="@/assets/images/line_1.png" />
<div class="type-wrapper">

View File

@@ -60,6 +60,7 @@ import RiskStatisticsPanel from './components/RiskStatisticsPanel.vue'
import HighRiskAlertPanel from './components/HighRiskAlertPanel.vue'
import TimeoutWorkOrderPanel from './components/TimeoutWorkOrderPanel.vue'
import HiddenDangerPanel from './components/HiddenDangerPanel.vue'
import {error} from "echarts/types/src/util/log";
// 类型定义
interface AlertItem {
@@ -484,7 +485,16 @@ const handleHiddenDangerPannelData = (query) => {
_data2.general = Number(res.records[0].general)
_data2.major = Number(res.records[0].major)
// 安全指数另算,再起一个报表
// dashboardData.value.hiddenDangerData.safetyIndex = res.records[0].safetyIndex
// 在这里添加获取安全指数的逻辑
getTableList('hidden_danger_safety_index', query).then(res => {
if (res.records && res.records.length > 0) {
dashboardData.value.hiddenDangerData.safetyIndex = res.records[0].safetyIndex
}
}).catch(error => {
console.error('获取隐患排查治理数据失败:', error)
})
// 获取隐患排查治理处理进度数据
getTableList('hidden_danger_process_progress', query).then(res => {

View File

@@ -33,9 +33,10 @@
<div class="center-container">
<div class="center-content">
<span class="title">隐患排查治理</span>
<!-- 隐患排查治理 -->
<span class="title"></span>
<img class="bottom-border-line" src="@/assets/images/title_border_line_1.png" />
<span class="sub-title">分类风险</span>
<span class="sub-title">隐患等级</span>
<img width="50%" src="@/assets/images/line_1.png" />
<div class="type-wrapper">
<div class="type-item">

View File

@@ -60,7 +60,8 @@
</div>
<div class="bottom-card">
<div class="bottom-card-title">
<span>隐患排查治理</span>
<!--隐患排查治理-->
<span></span>
<img width="50%" style="margin: 8px 0" src="@/assets/images/line_1.png" />
</div>
<div class="type-wrapper">

View File

@@ -0,0 +1,862 @@
<template>
<div class="big-screen-container">
<!-- 标题栏 -->
<div class="screen-header">
<h1 class="screen-title">动环监控大屏</h1>
<div class="screen-datetime">{{ currentDateTime }}</div>
</div>
<!-- 主要内容区域 -->
<div class="screen-content">
<!-- 第一行统计卡片 -->
<div class="stats-row">
<!-- 总设备数卡片 -->
<div class="stat-card">
<div class="card-title">总设备数</div>
<div class="card-value">{{ totalDevices.toLocaleString() }}</div>
<div class="card-trend growth">
<svg class="trend-icon" viewBox="0 0 1024 1024" width="16" height="16" fill="currentColor">
<path d="M868 545.5L536.1 163a31.96 31.96 0 0 0-48.3 0L156 545.5a7.97 7.97 0 0 0 6 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z" />
</svg>
<span>较上月增长 {{ totalDevicesGrowth }}%</span>
</div>
</div>
<!-- 在线设备数卡片 -->
<div class="stat-card">
<div class="card-title">在线设备数</div>
<div class="card-value">{{ onlineDevices.toLocaleString() }}</div>
<div class="card-trend online-rate">
<span>在线率 {{ onlineRate }}%</span>
</div>
</div>
</div>
<!-- 第二行图表 -->
<div class="charts-row">
<!-- 告警趋势折线图 -->
<div class="chart-card">
<div class="chart-title">当月告警趋势</div>
<div ref="alarmTrendChartRef" class="chart-container"></div>
</div>
<!-- 设备类型分布饼图 -->
<div class="chart-card">
<div class="chart-title">告警设备类型分布</div>
<div ref="deviceTypePieChartRef" class="chart-container"></div>
</div>
</div>
<!-- 第三行园区信息列表 -->
<div class="table-row">
<div class="table-card">
<div class="table-title">园区信息列表</div>
<el-table
:data="parkList"
:style="{ width: '100%' }"
class="park-table"
height="calc(100% - 50px)"
:header-cell-style="{
background: '#1a3a52',
color: '#ffffff',
borderBottom: '1px solid rgba(78, 155, 248, 0.15)',
fontWeight: '500',
padding: '12px 8px'
}"
:row-style="getRowStyle"
:cell-style="{
borderBottom: '1px solid rgba(78, 155, 248, 0.08)',
color: '#ffffff',
padding: '12px 8px'
}"
>
<el-table-column prop="parkName" label="园区名称" min-width="200" align="left" />
<el-table-column prop="totalDevices" label="设备总数" min-width="120" align="center">
<template #default="{ row }">
<span class="device-count">{{ row.totalDevices }}</span>
</template>
</el-table-column>
<el-table-column prop="upsStatus" label="UPS" min-width="140" align="center">
<template #default="{ row }">
<span :class="['status-text', row.upsStatus === '正常' ? 'status-normal' : 'status-alarm']">
{{ row.upsStatus }}
</span>
</template>
</el-table-column>
<el-table-column prop="airConditionStatus" label="精密空调" min-width="140" align="center">
<template #default="{ row }">
<span :class="['status-text', row.airConditionStatus === '正常' ? 'status-normal' : 'status-alarm']">
{{ row.airConditionStatus }}
</span>
</template>
</el-table-column>
<el-table-column prop="temperatureStatus" label="温湿度" min-width="140" align="center">
<template #default="{ row }">
<span :class="['status-text', row.temperatureStatus === '正常' ? 'status-normal' : 'status-alarm']">
{{ row.temperatureStatus }}
</span>
</template>
</el-table-column>
<el-table-column prop="otherStatus" label="其他" min-width="140" align="center">
<template #default="{ row }">
<span :class="['status-text', row.otherStatus === '正常' ? 'status-normal' : 'status-alarm']">
{{ row.otherStatus }}
</span>
</template>
</el-table-column>
<el-table-column label="详情" min-width="180" align="center">
<template #default="{ row }">
<a
:class="['detail-link', row.hasAlarm ? 'detail-alarm' : 'detail-normal']"
@click="handleViewDetail(row)"
>
<span v-if="row.hasAlarm" class="alarm-badge">异常</span>
<span v-else class="normal-badge">正常</span>
查看详情
</a>
</template>
</el-table-column>
</el-table>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, onBeforeUnmount } from 'vue';
import * as echarts from 'echarts';
import type { EChartsOption } from 'echarts';
// 定义园区信息类型
interface ParkInfo {
key: string;
parkName: string;
totalDevices: number;
upsStatus: string;
airConditionStatus: string;
temperatureStatus: string | number;
otherStatus: string;
hasAlarm: boolean;
}
// 当前日期时间
const currentDateTime = ref('');
// 统计数据
const totalDevices = ref(1286);
const totalDevicesGrowth = ref(5.2);
const onlineDevices = ref(1254);
const onlineRate = ref(97.5);
// 图表引用
const alarmTrendChartRef = ref<HTMLDivElement>();
const deviceTypePieChartRef = ref<HTMLDivElement>();
// 图表实例
let alarmTrendChart: echarts.ECharts | null = null;
let deviceTypePieChart: echarts.ECharts | null = null;
// 告警趋势数据
const alarmTrendData = ref({
dates: ['5日', '10日', '15日', '20日', '25日', '30日'],
values: [8, 4, 20, 16, 21, 9]
});
// 设备类型分布数据
const deviceTypeData = ref([
{ name: 'UPS', value: 35 },
{ name: '精密空调', value: 25 },
{ name: '温湿度检测', value: 20 },
{ name: '其他', value: 20 }
]);
// 园区信息列表数据
const parkList = ref<ParkInfo[]>([
{
key: '1',
parkName: '雄安总部',
totalDevices: 156,
upsStatus: '3个告警',
airConditionStatus: '正常',
temperatureStatus: '正常',
otherStatus: '正常',
hasAlarm: true
},
{
key: '2',
parkName: '恒毅大厦',
totalDevices: 98,
upsStatus: '正常',
airConditionStatus: '正常',
temperatureStatus: '正常',
otherStatus: '正常',
hasAlarm: false
},
{
key: '3',
parkName: '丰台创新中心',
totalDevices: 124,
upsStatus: '正常',
airConditionStatus: '正常',
temperatureStatus: '正常',
otherStatus: '正常',
hasAlarm: false
},
{
key: '4',
parkName: '重庆产业大厦',
totalDevices: 92,
upsStatus: '正常',
airConditionStatus: '2个告警',
temperatureStatus: '正常',
otherStatus: '正常',
hasAlarm: true
},
{
key: '5',
parkName: '海南园区',
totalDevices: 78,
upsStatus: '正常',
airConditionStatus: '正常',
temperatureStatus: '正常',
otherStatus: '正常',
hasAlarm: false
},
{
key: '6',
parkName: '崇左地面站',
totalDevices: 64,
upsStatus: '正常',
airConditionStatus: '正常',
temperatureStatus: '正常',
otherStatus: '正常',
hasAlarm: false
},
{
key: '7',
parkName: '铜川地面站',
totalDevices: 58,
upsStatus: '正常',
airConditionStatus: '正常',
temperatureStatus: '正常',
otherStatus: '正常',
hasAlarm: false
},
{
key: '8',
parkName: '佳木斯地面站',
totalDevices: 72,
upsStatus: '正常',
airConditionStatus: '正常',
temperatureStatus: '正常',
otherStatus: '正常',
hasAlarm: false
},
{
key: '9',
parkName: '库尔勒地面站',
totalDevices: 68,
upsStatus: '正常',
airConditionStatus: '正常',
temperatureStatus: '正常',
otherStatus: '正常',
hasAlarm: false
},
{
key: '10',
parkName: '澄迈地面站',
totalDevices: 56,
upsStatus: '正常',
airConditionStatus: '正常',
temperatureStatus: '正常',
otherStatus: '正常',
hasAlarm: false
},
{
key: '11',
parkName: '文昌地面站',
totalDevices: 60,
upsStatus: '正常',
airConditionStatus: '正常',
temperatureStatus: '正常',
otherStatus: '正常',
hasAlarm: false
}
]);
// 更新日期时间
const updateDateTime = () => {
const now = new Date();
const year = now.getFullYear();
const month = String(now.getMonth() + 1).padStart(2, '0');
const day = String(now.getDate()).padStart(2, '0');
const hours = String(now.getHours()).padStart(2, '0');
const minutes = String(now.getMinutes()).padStart(2, '0');
const seconds = String(now.getSeconds()).padStart(2, '0');
currentDateTime.value = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
};
// 初始化告警趋势图表
const initAlarmTrendChart = () => {
if (!alarmTrendChartRef.value) return;
alarmTrendChart = echarts.init(alarmTrendChartRef.value);
const option: EChartsOption = {
grid: {
top: '15%',
left: '8%',
right: '5%',
bottom: '12%',
containLabel: true
},
xAxis: {
type: 'category',
data: alarmTrendData.value.dates,
axisLine: {
lineStyle: {
color: '#3a5165'
}
},
axisLabel: {
color: '#8b9bb3',
fontSize: 12
},
splitLine: {
show: true,
lineStyle: {
color: '#1e3a52',
type: 'dashed'
}
}
},
yAxis: {
type: 'value',
min: 0,
max: 25,
interval: 5,
axisLine: {
show: false
},
axisLabel: {
color: '#8b9bb3',
fontSize: 12
},
splitLine: {
lineStyle: {
color: '#1e3a52',
type: 'dashed'
}
}
},
series: [
{
data: alarmTrendData.value.values,
type: 'line',
smooth: true,
lineStyle: {
color: '#4e9bf8',
width: 2
},
itemStyle: {
color: '#4e9bf8',
borderWidth: 2
},
areaStyle: {
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{ offset: 0, color: 'rgba(78, 155, 248, 0.3)' },
{ offset: 1, color: 'rgba(78, 155, 248, 0.05)' }
]
}
},
markPoint: {
symbol: 'circle',
symbolSize: 8,
itemStyle: {
color: '#ff5555',
borderWidth: 2,
borderColor: '#ff5555'
},
data: [
{ name: '峰值1', coord: [2, 20] }, // 15日的告警峰值
{ name: '峰值2', coord: [4, 21] } // 25日的告警峰值
]
}
}
]
};
alarmTrendChart.setOption(option);
};
// 初始化设备类型分布饼图
const initDeviceTypePieChart = () => {
if (!deviceTypePieChartRef.value) return;
deviceTypePieChart = echarts.init(deviceTypePieChartRef.value);
const total = deviceTypeData.value.reduce((sum, item) => sum + item.value, 0);
const option: EChartsOption = {
legend: {
orient: 'vertical',
right: '10%',
top: 'center',
textStyle: {
color: '#ffffff',
fontSize: 13
},
formatter: (name: string) => {
const item = deviceTypeData.value.find(d => d.name === name);
return `${name} (${item?.value || 0})`;
}
},
series: [
{
type: 'pie',
radius: ['45%', '70%'],
center: ['35%', '50%'],
avoidLabelOverlap: false,
label: {
show: true,
position: 'center',
formatter: () => {
return `{value|${total}}\n{label|告警}`;
},
rich: {
value: {
color: '#ffffff',
fontSize: 28,
fontWeight: 'bold',
lineHeight: 40
},
label: {
color: '#8b9bb3',
fontSize: 14,
lineHeight: 20
}
}
},
labelLine: {
show: false
},
data: deviceTypeData.value.map((item, index) => {
const colors = ['#4e9bf8', '#52c41a', '#fa8c16', '#8c8c8c'];
return {
name: item.name,
value: item.value,
itemStyle: {
color: colors[index]
}
};
})
}
]
};
deviceTypePieChart.setOption(option);
};
// 获取行样式(条纹效果)
const getRowStyle = ({ rowIndex }: { rowIndex: number }) => {
if (rowIndex % 2 === 0) {
return {
background: 'rgba(78, 155, 248, 0.03)',
color: '#ffffff'
};
}
return {
background: 'transparent',
color: '#ffffff'
};
};
// 查看详情
const handleViewDetail = (record: ParkInfo) => {
console.log('查看园区详情:', record);
// TODO: 实现详情页面跳转或弹窗
};
// 定时器
let dateTimeTimer: number | null = null;
// 组件挂载
onMounted(() => {
// 更新日期时间
updateDateTime();
dateTimeTimer = window.setInterval(updateDateTime, 1000);
// 初始化图表
setTimeout(() => {
initAlarmTrendChart();
initDeviceTypePieChart();
}, 100);
// 监听窗口大小变化
window.addEventListener('resize', handleResize);
});
// 组件卸载
onBeforeUnmount(() => {
if (dateTimeTimer) {
clearInterval(dateTimeTimer);
}
if (alarmTrendChart) {
alarmTrendChart.dispose();
}
if (deviceTypePieChart) {
deviceTypePieChart.dispose();
}
window.removeEventListener('resize', handleResize);
});
// 处理窗口大小变化
const handleResize = () => {
alarmTrendChart?.resize();
deviceTypePieChart?.resize();
};
</script>
<style scoped lang="scss">
.big-screen-container {
width: 100%;
min-height: 100vh;
background: linear-gradient(180deg, #0a1929 0%, #0d1e2f 100%);
padding: 20px;
box-sizing: border-box;
overflow: auto;
}
// 标题栏
.screen-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
padding: 0 10px;
.screen-title {
font-size: 32px;
font-weight: bold;
color: #ffffff;
margin: 0;
letter-spacing: 2px;
}
.screen-datetime {
font-size: 18px;
color: #8b9bb3;
font-family: 'Courier New', monospace;
}
}
// 主要内容区域
.screen-content {
display: flex;
flex-direction: column;
gap: 20px;
}
// 统计卡片行
.stats-row {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
}
.stat-card {
background: linear-gradient(135deg, #1a2940 0%, #0f1e2d 100%);
border-radius: 12px;
padding: 30px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
border: 1px solid rgba(78, 155, 248, 0.1);
.card-title {
font-size: 16px;
color: #8b9bb3;
margin-bottom: 15px;
}
.card-value {
font-size: 48px;
font-weight: bold;
color: #ffffff;
margin-bottom: 12px;
font-family: 'Arial', sans-serif;
}
.card-trend {
display: flex;
align-items: center;
gap: 6px;
font-size: 14px;
&.growth {
color: #52c41a;
.trend-icon {
width: 16px;
height: 16px;
flex-shrink: 0;
}
}
&.online-rate {
color: #13c2c2;
}
}
}
// 图表行
.charts-row {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
}
.chart-card {
background: linear-gradient(135deg, #1a2940 0%, #0f1e2d 100%);
border-radius: 12px;
padding: 20px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
border: 1px solid rgba(78, 155, 248, 0.1);
height: 350px;
.chart-title {
font-size: 16px;
color: #ffffff;
margin-bottom: 15px;
font-weight: 500;
}
.chart-container {
width: 100%;
height: calc(100% - 40px);
}
}
// 表格行
.table-row {
width: 100%;
}
.table-card {
background: linear-gradient(135deg, #1a2940 0%, #0f1e2d 100%);
border-radius: 12px;
padding: 20px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
border: 1px solid rgba(78, 155, 248, 0.1);
height: 450px;
.table-title {
font-size: 16px;
color: #ffffff;
margin-bottom: 15px;
font-weight: 500;
}
:deep(.park-table) {
background: transparent !important;
// 表格主体背景
.el-table__inner-wrapper {
background: transparent !important;
&::before {
display: none;
}
}
.el-table__body-wrapper {
background: transparent !important;
// 滚动条样式
scrollbar-width: thin;
scrollbar-color: rgba(78, 155, 248, 0.3) transparent;
&::-webkit-scrollbar {
width: 6px;
}
&::-webkit-scrollbar-thumb {
background: rgba(78, 155, 248, 0.3);
border-radius: 3px;
}
&::-webkit-scrollbar-track {
background: transparent;
}
}
.el-table__header-wrapper,
.el-table__footer-wrapper {
background: transparent !important;
}
// 表格行悬浮效果
.el-table__row {
&:hover > td {
background: rgba(78, 155, 248, 0.1) !important;
}
}
// 空数据样式
.el-table__empty-block {
background: transparent !important;
.el-table__empty-text {
color: #8b9bb3;
}
}
.device-count {
color: #ffffff;
font-weight: 500;
}
.status-text {
padding: 2px 8px;
border-radius: 4px;
font-size: 13px;
&.status-normal {
color: #52c41a;
}
&.status-alarm {
color: #ff4d4f;
}
}
.detail-link {
cursor: pointer;
font-size: 13px;
display: inline-flex;
align-items: center;
gap: 8px;
text-decoration: none;
color: #4e9bf8;
.alarm-badge,
.normal-badge {
display: inline-block;
padding: 4px 12px;
border-radius: 4px;
font-size: 12px;
color: #ffffff;
font-weight: 500;
}
.alarm-badge {
background: #ff4d4f;
}
.normal-badge {
background: #52c41a;
}
&:hover {
opacity: 0.8;
}
}
}
}
// 响应式布局
@media screen and (max-width: 1600px) {
.screen-header {
.screen-title {
font-size: 28px;
}
.screen-datetime {
font-size: 16px;
}
}
.stat-card {
padding: 25px;
.card-value {
font-size: 42px;
}
}
.chart-card {
height: 320px;
}
.table-card {
height: 400px;
}
}
@media screen and (max-width: 1280px) {
.screen-header {
.screen-title {
font-size: 26px;
}
.screen-datetime {
font-size: 15px;
}
}
.stat-card {
padding: 20px;
.card-title {
font-size: 14px;
}
.card-value {
font-size: 38px;
}
.card-trend {
font-size: 13px;
}
}
.chart-card {
height: 300px;
padding: 15px;
.chart-title {
font-size: 14px;
}
}
.table-card {
height: 380px;
padding: 15px;
.table-title {
font-size: 14px;
}
}
}
// 仅在非常小的屏幕小于1024px才改为单列
@media screen and (max-width: 1024px) {
.stats-row,
.charts-row {
grid-template-columns: 1fr;
}
.chart-card {
height: 280px;
}
.table-card {
height: 360px;
}
}
</style>

View File

@@ -3,7 +3,8 @@
<!-- 顶部标题栏 -->
<div class="header-container">
<div class="header-left">
<img class="back-img" @click="returnToHeadquarters" src="@/assets/images/screen/back_image.png" />
<img class="back-img" @click="returnToHeadquarters"
src="@/assets/images/screen/back_image.png"/>
<div class="back-button" @click="openRegionSelector"> {{ selectedRegion }}
<span>···</span>
</div>
@@ -22,23 +23,28 @@
<div class="left-wrapper">
<OverviewPanel :totalCount="dashboardData?.totalCount || 0"
:formalEmployeeCount="dashboardData?.formalEmployeeCount || 0"
:externalStaffCount="dashboardData?.externalStaffCount || 0" :visitorCount="dashboardData?.visitorCount || 0"
:externalStaffCount="dashboardData?.externalStaffCount || 0"
:visitorCount="dashboardData?.visitorCount || 0"
:parkStatistics="dashboardData?.parkStatistics"/>
<RiskStatisticsPanel :riskStatistics="riskStatistics" :dangerDetail="dangerDetail" :park="parkValue"
<RiskStatisticsPanel :riskStatistics="riskStatistics" :dangerDetail="dangerDetail"
:park="parkValue"
@tab-change="handleRiskTabChange" :campus_id="query.campus_id"/>
</div>
<div class="right-wrapper">
<HighRiskAlertPanel :alertData="dashboardData?.alertData" :alertDetails="dashboardData?.alertData.details"
<HighRiskAlertPanel :alertData="dashboardData?.alertData"
:alertDetails="dashboardData?.alertData.details"
:sourceIndex="sourceIndex"/>
<TimeoutWorkOrderPanel :timeoutWorkOrders="dashboardData?.timeoutWorkOrders"
:alertDetails="dashboardData?.timeoutWorkOrders.details" :sourceIndex="sourceIndex" />
:alertDetails="dashboardData?.timeoutWorkOrders.details"
:sourceIndex="sourceIndex"/>
</div>
<HiddenDangerPanel :hiddenDangerData="dashboardData?.hiddenDangerData"/>
</div>
</div>
<!-- 区域选择弹窗 -->
<RegionSelector v-model="regionSelectorVisible" :modelSelected="selectedPark" :regions="regionOption"
<RegionSelector v-model="regionSelectorVisible" :modelSelected="selectedPark"
:regions="regionOption"
@change="onRegionChange"/>
</template>
@@ -252,7 +258,9 @@ onMounted(async () => {
// 去重region字段使用Map来确保唯一性
const regionMap = new Map()
records.filter((el) => el.region_id == query.regionCode)
.map(el => { return el })
.map(el => {
return el
})
.forEach(el => {
if (!regionMap.has(el.park_name)) {
regionMap.set(el.park_name, {
@@ -480,7 +488,16 @@ const handleHiddenDangerPannelData = (query) => {
_data2.general = Number(res.records[0].general)
_data2.major = Number(res.records[0].major)
// 安全指数另算,再起一个报表
// dashboardData.value.hiddenDangerData.safetyIndex = res.records[0].safetyIndex
// 在这里添加获取安全指数的逻辑
getTableList('hidden_danger_safety_index', query).then(res => {
if (res.records && res.records.length > 0) {
dashboardData.value.hiddenDangerData.safetyIndex = res.records[0].safetyIndex
}
}).catch(error => {
console.error('获取隐患排查治理数据失败:', error)
})
// 获取隐患排查治理处理进度数据
getTableList('hidden_danger_process_progress', query).then(res => {
@@ -1219,12 +1236,10 @@ const timeOut1 = (): void => {
.left-top {
padding: 0 5px;
background-image:
url('@/assets/images/screen/left_top_img.png'),
background-image: url('@/assets/images/screen/left_top_img.png'),
url('@/assets/images/screen/left_center_img.png'),
url('@/assets/images/screen/left_bottom_img.png');
background-position:
top center,
background-position: top center,
left center,
bottom center;
@@ -1232,8 +1247,7 @@ const timeOut1 = (): void => {
background-repeat: no-repeat, no-repeat, no-repeat;
/* 设置位置 */
background-size:
100% 90px,
background-size: 100% 90px,
cover,
100% 68px;
flex: 1;
@@ -1396,12 +1410,10 @@ const timeOut1 = (): void => {
}
.left-bottom {
background-image:
url('@/assets/images/screen/left_top_2_img.png'),
background-image: url('@/assets/images/screen/left_top_2_img.png'),
url('@/assets/images/screen/left_center_img.png'),
url('@/assets/images/screen/left_bottom_img.png');
background-position:
top center,
background-position: top center,
left center,
bottom center;
@@ -1409,8 +1421,7 @@ const timeOut1 = (): void => {
background-repeat: no-repeat, no-repeat, no-repeat;
/* 设置位置 */
background-size:
100% 90px,
background-size: 100% 90px,
cover,
100% 68px;
flex: 1;
@@ -1462,8 +1473,6 @@ const timeOut1 = (): void => {
row-gap: 1rem;
}
.center-container {

View File

@@ -32,7 +32,7 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
// 本地跨域代理. 目前注释的原因暂时没有用途server 端已经支持跨域
proxy: {
['/admin-api']: {
target: env.VITE_BASE_URL,
target: 'http://10.28.117.48:48080',
ws: false,
changeOrigin: true,
rewrite: (path) => path.replace(new RegExp(`^/admin-api`), ''),