Merge remote-tracking branch 'origin/master'

chenyao

2026-01-09 ebd0ec4f51288042b6fc5bf714b1febbb63cfacc

 uniapps/work-app/src/pages/work/index.vue

@@ -1,16 +1,207 @@
<template>
  <view class="eventTickets">
    工单
  </view>
  <div class="eventTickets" :style="{ paddingTop: topMargin + 'px' }">

    <div class="searchTop">
      <up-search placeholder="请输入关键字搜索"  :animation="true"  v-model="listParams.keyword" :show-action="false"></up-search>
    </div>
    <div class="listBox">
      <div class="tabs-container">
        <up-tabs :list="tabList" @click="handleClick"></up-tabs>
      </div>

      <div class="eventBox">
        <div class="eventItem"  v-for="(item,index) in dataList" :key="index">
          <img :src="item.photo_url" alt="" @click="detailHandle(item)" />
          <div class="informationDisplay">
            <div class="itemTitle">{{item.event_name}}</div>
            <div class="itemContent">{{formatDate(item.create_time) }}</div>
          </div>
        </div>
      </div>
    </div>

  </div>

</template>

<script setup>

import { useUserStore } from '@/store/index.js'
import {getList,getstatusCount} from '/src/api/work/index.js'
import dayjs from 'dayjs';
import { getStatusBarHeight } from '@/utils/common';
const userStore = useUserStore()
const userInfo = userStore.userInfo
const dataList = ref([])
const currentTab=ref('all')
const tabList = ref([
  {
    name: '全部工单',
    key: 'all',
    badge: {
      value: 2
    },
    status: null
  },
  {
    name: '我的工单',
    key: 'myTickets',
    badge: {
      value: 1
    }
  },


])
const formatDate = (dateString) => {
  return dayjs(dateString).format('MM/DD HH:mm');
};
const listParams = ref({
  status: null,
  current: 1,
  size: 9999,
  source: 1,
  department:'',
  keyword:''

})
const getDataList = () => {
  const params = {
    current: 1,
    size: 9999,
    source: 1,
    status:listParams.value.status,
    event_name:listParams.value.keyword,
    user_id:currentTab.value=== 'myTickets' ?userInfo.user_id : undefined
  }
  getList(params).then(res => {

    const response = res.data.data.records
    dataList.value = response
  })
}
// const getstatusCountData=()=>{
//    getstatusCount().then(res=>{
//       const response = res.data.data
//        const { statusCount, totalCount, userCount } = response
//       tabList.value.forEach(tab=>{
//
//          if(tab.key === 'all'){
//             tab.badge.value = totalCount || 0
//
//          }else if(tab.key === 'myTickets'){
//             tab.badge.value = userCount || 0
//          }else{
//             tab.badge.value=statusCount[String(tab.status)] || 0
//          }
//       })
//
//    })
// }

const handleClick = (item) => {
  currentTab.value = item.key
  listParams.value.status = item.status
  getDataList()
}
const detailHandle = (val) => {
  uni.navigateTo({
    url: `/subPackages/workDetail/index?eventNum=${val.event_num}`,
  })
}
const topMargin = getStatusBarHeight()
onShow(() => {
  getDataList()

})
</script>

<style scoped lang="scss">
.eventTickets {
  width: 100%;
  padding: 0 20rpx;
  display: flex;
  flex-direction: column;
  height: 100%;
  box-sizing: border-box;
  .searchTop {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 24rpx;
    width: 100%;
    height: 108rpx;
  }
  :deep(){

    .u-tabs__wrapper__nav__line{
      width: 80rpx !important;
      background: #1D6FE9 !important;
    }
    .u-badge {
      background-color: #1d6fe9 !important;
    }
  }


  .tabs-container{
    display: flex;
    justify-content: center;
    height: 98rpx;
  }
  .listBox {
    position: relative;
    display: flex;
    flex-direction: column;
    flex: 1;
  }
  .eventBox {
    display: flex;
    flex-wrap: wrap;
    gap: 20rpx;
    padding: 20rpx 0;
    overflow-y: auto;
    height: 0;
    flex-grow: 1;
    align-content: flex-start;

    .eventItem {
      width: calc(50% - 10rpx);
      background-color: #fff;
      border-radius: 12rpx;
      overflow: hidden;

      img {
        width: 341rpx;
        height: 196rpx;
        border-radius: 12rpx;
        overflow: hidden;
      }
      .informationDisplay{
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10rpx 20rpx 10rpx 12rpx;
        .itemTitle {
          width: 144rpx;
          font-family: Source Han Sans CN, Source Han Sans CN;
          font-weight: 500;
          font-size: 28rpx;
          color: #000000;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
        }

        .itemContent {
          font-family: Source Han Sans CN, Source Han Sans CN;
          font-weight: 400;
          font-size: 24rpx;
          color: rgba(0,0,0,0.5);

        }
      }

    }
  }
}
</style>