2026.4.10

feiyu02

6 天以前 ccc970e575ef3f3e5c67af8da210263f4ac549f9

 src/views/analysis/huanxincode/HuanxinCodeManage.vue

@@ -31,8 +31,8 @@
      <el-col :span="8">
        <el-card shadow="hover" class="dashboard-card green-card" @click="filterByCode('green')">
          <div class="card-content">
            <div class="card-title">绿码店铺数</div>
            <div class="card-value">{{ statistics.greenCount }}</div>
            <div class="card-title">绿码店铺</div>
            <div class="card-value">{{ statistics.greenCount }}<el-text>个</el-text></div>
            <div class="card-percentage">{{ statistics.greenPercentage }}%</div>
          </div>
        </el-card>
@@ -40,8 +40,8 @@
      <el-col :span="8">
        <el-card shadow="hover" class="dashboard-card yellow-card" @click="filterByCode('yellow')">
          <div class="card-content">
            <div class="card-title">黄码店铺数</div>
            <div class="card-value">{{ statistics.yellowCount }}</div>
            <div class="card-title">黄码店铺</div>
            <div class="card-value">{{ statistics.yellowCount }}<el-text>个</el-text></div>
            <div class="card-percentage">{{ statistics.yellowPercentage }}%</div>
          </div>
        </el-card>
@@ -49,8 +49,8 @@
      <el-col :span="8">
        <el-card shadow="hover" class="dashboard-card red-card" @click="filterByCode('red')">
          <div class="card-content">
            <div class="card-title">红码店铺数</div>
            <div class="card-value">{{ statistics.redCount }}</div>
            <div class="card-title">红码店铺</div>
            <div class="card-value">{{ statistics.redCount }}<el-text>个</el-text></div>
            <div class="card-percentage">{{ statistics.redPercentage }}%</div>
          </div>
        </el-card>
@@ -67,7 +67,7 @@

    <!-- 店铺列表 -->
    <div class="shop-list">
      <el-table :data="pagedShopList" style="width: 100%">
      <el-table :data="filteredShopList" style="width: 100%" max-height="600px">
        <el-table-column prop="shopName" label="店铺名称" />
        <el-table-column prop="district" label="所在区县" width="120" />
        <el-table-column prop="town" label="所在街镇" width="150" />
@@ -107,7 +107,7 @@
          v-model:page-size="pageSize"
          :page-sizes="[10, 20, 50, 100]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="filteredShopList.length"
          :total="total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
        />
@@ -221,7 +221,7 @@
    label: '餐饮',
    value: '1',
  },
  time: dayjs('2023-08-01').date(1).toDate(),
  time: dayjs('2025-08-01').date(1).toDate(),
})
// 状态
const drawerVisible = ref(false)
@@ -232,6 +232,7 @@
// 分页相关
const currentPage = ref(1)
const pageSize = ref(10)
const total = ref(0)
// 环信码图片URL
const codeImageUrl = ref('')

@@ -244,42 +245,6 @@
  redCount: 20,
  redPercentage: 10.5,
})

// 店铺名称列表
const shopNames = [
  '付小姐在成都',
  '吉刻联盟',
  '家在塔啦',
  '狼来了',
  '乐凯撒星游店',
  '馨远美食小镇（哈尼美食广场）',
  '棒约翰',
  '弄堂咪道',
  '杨记齐齐哈尔烤肉',
  '上海稔传餐饮管理有限公司（人生一串）',
  '缘家',
  '泉盛餐饮（上海）有限公司（食其家）',
  '丰茂烤串',
  '上海泰煌餐饮管理有限公司（泰煌鸡）',
  '徐汇区辰熙餐馆(小铁君串烧居酒屋)',
]

// 徐汇区街镇列表
const xuhuiTowns = [
  '天平路街道',
  '湖南路街道',
  '斜土路街道',
  '枫林路街道',
  '长桥街道',
  '田林街道',
  '虹梅路街道',
  '康健新村街道',
  '徐家汇街道',
  '凌云路街道',
  '龙华街道',
  '漕河泾街道',
  '华泾镇',
]

function onSearch() {
  const f = formSearch.value
@@ -307,9 +272,7 @@

  userApi.fetchUser(currentPage.value, pageSize.value, area).then((res) => {
    if (res) {
      res.data
      res.head.totalCount

      total.value = res.head.totalCount
      shopList.value = res.data.map((item, index) => {
        const { score, code } = generateRandomScore()
        return {
@@ -336,9 +299,9 @@
  })
}

// 生成2023年8月内的随机时间
// 生成2025年8月内的随机时间
function generateRandomDate() {
  const year = 2023
  const year = 2025
  const month = 7 // 0-11，8月是7
  const day = Math.floor(Math.random() * 31) + 1 // 1-31
  const hour = Math.floor(Math.random() * 24) // 0-23
@@ -346,11 +309,6 @@

  const date = new Date(year, month, day, hour, minute)
  return date.toISOString().slice(0, 16).replace('T', ' ')
}

// 随机选择数组元素
function getRandomElement(array) {
  return array[Math.floor(Math.random() * array.length)]
}

// 生成随机评分和对应环信码等级
@@ -376,173 +334,7 @@
}

// 店铺数据
const shopList = ref([
  {
    id: 1,
    shopName: getRandomElement(shopNames),
    district: '徐汇区',
    town: getRandomElement(xuhuiTowns),
    code: 'green',
    score: 90,
    trend: generateRandomTrend(),
    lastUpdate: generateRandomDate(),
    warnings: [
      {
        time: generateRandomDate(),
        content: '净化器运行时长不足',
        score: 90,
        handled: true,
      },
    ],
  },
  {
    id: 2,
    shopName: getRandomElement(shopNames),
    district: '徐汇区',
    town: getRandomElement(xuhuiTowns),
    code: 'yellow',
    score: 75,
    trend: generateRandomTrend(),
    lastUpdate: generateRandomDate(),
    warnings: [
      {
        time: generateRandomDate(),
        content: '投诉次数较多',
        score: 80,
        handled: false,
      },
    ],
  },
  {
    id: 3,
    shopName: getRandomElement(shopNames),
    district: '徐汇区',
    town: getRandomElement(xuhuiTowns),
    code: 'red',
    score: 60,
    trend: generateRandomTrend(),
    lastUpdate: generateRandomDate(),
    warnings: [
      {
        time: generateRandomDate(),
        content: '排放浓度超标',
        score: 65,
        handled: false,
      },
      {
        time: generateRandomDate(),
        content: '清洗频次不足',
        score: 62,
        handled: false,
      },
    ],
  },
  {
    id: 4,
    shopName: getRandomElement(shopNames),
    district: '徐汇区',
    town: getRandomElement(xuhuiTowns),
    code: 'green',
    score: 92,
    trend: generateRandomTrend(),
    lastUpdate: generateRandomDate(),
    warnings: [],
  },
  {
    id: 5,
    shopName: getRandomElement(shopNames),
    district: '徐汇区',
    town: getRandomElement(xuhuiTowns),
    code: 'yellow',
    score: 78,
    trend: generateRandomTrend(),
    lastUpdate: generateRandomDate(),
    warnings: [
      {
        time: generateRandomDate(),
        content: '风机联动率低',
        score: 75,
        handled: true,
      },
    ],
  },
  {
    id: 6,
    shopName: getRandomElement(shopNames),
    district: '徐汇区',
    town: getRandomElement(xuhuiTowns),
    code: 'green',
    score: 90,
    trend: generateRandomTrend(),
    lastUpdate: generateRandomDate(),
    warnings: [],
  },
  {
    id: 7,
    shopName: getRandomElement(shopNames),
    district: '徐汇区',
    town: getRandomElement(xuhuiTowns),
    code: 'red',
    score: 55,
    trend: generateRandomTrend(),
    lastUpdate: generateRandomDate(),
    warnings: [
      {
        time: generateRandomDate(),
        content: '未安装油烟净化设备',
        score: 60,
        handled: false,
      },
    ],
  },
  {
    id: 8,
    shopName: getRandomElement(shopNames),
    district: '徐汇区',
    town: getRandomElement(xuhuiTowns),
    code: 'yellow',
    score: 72,
    trend: generateRandomTrend(),
    lastUpdate: generateRandomDate(),
    warnings: [
      {
        time: generateRandomDate(),
        content: '净化器清洗不及时',
        score: 75,
        handled: true,
      },
    ],
  },
  {
    id: 9,
    shopName: getRandomElement(shopNames),
    district: '徐汇区',
    town: getRandomElement(xuhuiTowns),
    code: 'green',
    score: 93,
    trend: generateRandomTrend(),
    lastUpdate: generateRandomDate(),
    warnings: [],
  },
  {
    id: 10,
    shopName: getRandomElement(shopNames),
    district: '徐汇区',
    town: getRandomElement(xuhuiTowns),
    code: 'yellow',
    score: 76,
    trend: generateRandomTrend(),
    lastUpdate: generateRandomDate(),
    warnings: [
      {
        time: generateRandomDate(),
        content: '排放浓度接近标准限值',
        score: 78,
        handled: true,
      },
    ],
  },
])
const shopList = ref([])

// 过滤后的店铺列表
const filteredShopList = computed(() => {
@@ -550,13 +342,6 @@
    return shopList.value
  }
  return shopList.value.filter((shop) => shop.code === filterCode.value)
})

// 分页后的店铺列表
const pagedShopList = computed(() => {
  const start = (currentPage.value - 1) * pageSize.value
  const end = start + pageSize.value
  return filteredShopList.value.slice(start, end)
})

// 生命周期
@@ -581,10 +366,12 @@
function handleSizeChange(size) {
  pageSize.value = size
  currentPage.value = 1
  onSearch()
}

function handleCurrentChange(current) {
  currentPage.value = current
  onSearch()
}

function getCodeType(code) {
@@ -829,7 +616,7 @@

.card-content {
  text-align: center;
  padding: 20px 0;
  padding: 0px 0;
}

.card-title {