罗广辉
2026-06-18 44dd9c4eb8a2489c63a5eb53fd4254bbb3510e95
src/pages/work/index.vue
@@ -1,214 +1,87 @@
<template>
   <view class="flex flex-col eventTickets">
      <view class="searchTop">
         <up-search placeholder="请输入关键字搜索"  :animation="true"  v-model="listParams.keyword" :show-action="false"></up-search>
         <div>111</div>
      </view>
      <view>
         <up-tabs :list="tabList" @click="handleClick"></up-tabs>
         <view class="eventBox">
            <view class="eventItem"  v-for="(item,index) in dataList" :key="index">
               <img :src="item.photo_url" alt="" @click="detailHandle(item)" />
               <div class="itemTitle">{{item.event_name}}</div>
               <div class="itemContent">
                  <div class="itemStatus">
                     <span v-if="item.status === 0" style="background-color: #ff7411;"></span>
                     <span v-else-if="item.status === 2" style="background-color: #ff472f;"></span>
                     <span v-else-if="item.status === 3" style="background-color: #ffc300;"></span>
                     <span v-else-if="item.status === 4" style="background-color: #06d957;"></span>
                     <p>{{formatDate(item.create_time) }}</p>
                  </div>
                  <div>全屏</div>
               </div>
            </view>
         </view>
      </view>
   </view>
  <view class="eventTickets">
    <WebViewPlus
      ref="sWebViewRef"
      :src="`${viewUrl}`"
      @webMessage="onPostMessage"
    />
  </view>
</template>
<script setup>
import { useUserStore } from '@/store/index.js'
import {getList,getstatusCount} from '/src/api/work/index.js'
   import dayjs from 'dayjs';
   const userStore = useUserStore()
   const userInfo = userStore.userInfo
import { getWebViewUrl } from "@/utils/index.js";
import WebViewPlus from "@/components/WebViewPlus.vue";
import { onShow, onHide } from "@dcloudio/uni-app";
   const dataList = ref([])
   const keyword = ref('')
   const currentTab=ref('myTickets')
   const tabList = ref([{
         name: '我的工单',
         key: 'myTickets',
         badge: {
            value: 1
         }
      },
      {
         name: '全部状态',
         key: 'all',
         badge: {
            value: 2
         },
         status: null
      },
      {
         name: '待审核',
         key: 'pending',
         badge: {
            value: 3
         },
         status: '2'
      },
      {
         name: '待处理',
         key: 'processing',
         badge: {
            value: 4
         },
         status: '0'
      },
      {
         name: '处理中',
         key: 'inProgress',
         badge: {
            value: 5
         },
         status: '3'
      },
      {
         name: '已完成',
         key: 'completed',
         badge: {
            value: 6
         },
         status: '4'
      }
   ])
   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 sWebViewRef = ref(null);
const updateKey = ref(0);
const viewUrl = computed(() => {
  // #ifdef MP-WEIXIN
  return getWebViewUrl("/work", {
    updateKey: updateKey.value,
    showAddBtn: 1,
  });
  // #endif
   })
   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
  // #ifndef MP-WEIXIN
  return getWebViewUrl("/work", {
    updateKey: updateKey.value,
    showAddBtn: 0,
  });
  // #endif
});
               }else if(tab.key === 'myTickets'){
                  tab.badge.value = userCount || 0
               }else{
                  tab.badge.value=statusCount[String(tab.status)] || 0
               }
            })
         })
      }
function onPostMessage(data) {
  // #ifdef MP-WEIXIN
  if (data.type === "addWork") {
  }
  // #endif
   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}`,
      })
   }
   onShow(() => {
      getDataList()
      getstatusCountData()
   })
  // #ifndef MP-WEIXIN
  if (data.type === "jumpMapNav") {
    uni.navigateTo({
      url: `/subPackages/workDetail/mapWork/index?currentItem=${data.eventNum}`,
    });
  } else if (data.type === "workid") {
    uni.navigateTo({
      url: `/subPackages/workDetail/index?eventNum=${data.eventNum}&totalNum=${data.totalNum}&keyword=${data.keyword}&aiType=${data.aiType}&status=${data.status}&current=${data.current}`,
    });
  } else if (data.type === "bigImage") {
    uni.navigateTo({
      url: `/subPackages/workDetail/photoMagnify/index?eventNum=${data.eventNum}`,
    });
  }
  // #endif
}
onShow(() => {
  const joinParams = uni.getStorageSync("joinParams");
  if (joinParams) {
    updateKey.value = updateKey.value + 1;
    uni.removeStorageSync("joinParams");
  }
  // #ifndef MP-WEIXIN
  uni.setTabBarItem({
    index: 2, // Tab 的索引(从0开始)
    // text: '新建工单',
    visible: true,
    pagePath: "subPackages/workDetail/addWork/index",
  });
  uni.setTabBarItem({
    index: 3, // Tab
    visible: false,
  });
  // #endif
});
onHide(() => {
});
</script>
<style scoped lang="scss">
   .eventTickets {
      padding: 0 10px;
      .searchTop {
         display: flex;
         align-items: center;
         margin-top: 10px;
      }
      :deep(.u-badge) {
         background-color: #1d6fe9 !important;
      }
      .eventBox {
         display: flex;
         flex-wrap: wrap;
         gap: 10px;
         padding: 10px 0;
         background-color: #ebeff2;
         .eventItem {
            width: calc(50% - 5px);
            background-color: #fff;
            border-radius: 5px;
            overflow: hidden;
            img {
               width: 100%;
               height: 100px;
               border-radius: 5px;
               overflow: hidden;
            }
            .itemTitle {
               padding: 0 5px;
                white-space: nowrap;
               overflow: hidden;
               text-overflow: ellipsis;
            }
            .itemContent {
               display: flex;
               justify-content: space-between;
               align-items: center;
               padding: 5px;
               .itemStatus {
                  display: flex;
                  align-items: center;
                  span {
                     display: inline-block;
                     width: 10px;
                     height: 10px;
                     border-radius: 50%;
                     margin-right: 5px;
                  }
               }
            }
         }
      }
   }
</style>
.eventTickets {
  width: 100%;
  height: 100%;
}
</style>