feat:待办事项

张含笑

2025-05-28 f2d98c04e761234b8f15767e7857605c33d4ecb1

feat:待办事项

 src/api/home/index.js

@@ -65,10 +65,32 @@
  });
};

// 待办事项
export const getdaiban = (type,areaCode) => {
// 获取事件工单和智飞工单的数量
export const getOrderCountApi = (areaCode) => {
  return request({
    url: '/drone-device-core/jobEvent/getOrderOrEventFive',
    url: '/drone-device-core/jobEvent/getOrderCount',
    method: 'get',
    params: {
    
      areaCode
    },
  });
};
// 标记事件工单或智飞工单已读
export const addOrderRecordApi = (type,ticketId) => {
  return request({
    url: '/drone-device-core/jobEvent/addOrderRecord',
    method: 'post',
    params: {
      type,
      ticketId
    },
  });
};
// 获取事件工单或者智飞工单的信息
export const getOrderOrEventApi = (type,areaCode) => {
  return request({
    url: '/drone-device-core/jobEvent/getOrderOrEvent',
    method: 'get',
    params: {
      type,

 src/views/wel/components/backlog.vue

@@ -6,14 +6,14 @@
        <div class="rightTab">
          <div
            class="titleItem"
            :class="item === checked ? 'activeItem' : ''"
            :class="item.name === checked ? 'activeItem' : ''"
            v-for="(item, index) in titleList"
            :key="index"
            @click="titleClick(item, index)"
          >
            <div>
              {{ item }}
              <div class="dots">{{checked==0?sjTotal: zfTotal}}</div>
              {{ item.name }}
              <div class="dots">{{ item.number }}</div>
            </div>
          </div>
        </div>
@@ -35,11 +35,9 @@
          <div class="content-wrapper">
            <div class="main-content">
              <span class="status-tag" :style="{ color: getStatusColor(item.status) }">{{
                permission.o_and_m_p_jump === true
                  ? zfstatusMap[item.status]
                  : statusMap[item.status]
                checked == '智飞工单' ? zfstatusMap[item.status] : statusMap[item.status]
              }}</span>
              <span class="unread"></span>
              <span class="reads" :class="item.is_read === 0 ? 'unread' :''"></span>
              <span class="todo-text">{{ item.name }}</span>
            </div>

@@ -68,25 +66,43 @@
import db3 from '@/assets/images/workbench/db3.png';
import db4 from '@/assets/images/workbench/db4.png';
import db5 from '@/assets/images/workbench/db5.png';
import { getdaiban } from '@/api/home/index';
import {
  getdaiban,
  getOrderCountApi,
  addOrderRecordApi,
  getOrderOrEventApi,
} from '@/api/home/index';
import { onMounted } from 'vue';
import { useRouter } from 'vue-router';
import { useStore } from 'vuex';
const zfTotal = ref(0)
const sjTotal = ref(0)
const zfTotal = ref(0);
const sjTotal = ref(0);
const router = useRouter();
const store = useStore();
const permission = computed(() => store.getters.permission);
// console.log('uuuuu', permission.value);
const checked = ref('事件工单');
const titleList = ref(['事件工单', '智飞工单']);
const titleList = ref([
  {
    label: 'event_order_count',
    name: '事件工单',
    number: 0,
  },
  {
    label: 'wayline_order_count',
    name: '智飞工单',
    number: 0,
  },
]);
const titleClick = (item, index) => {
  checked.value = item;
  checked.value = item.name;
  getListMatter();
};

const userInfo = computed(() => store.getters.userInfo);
const todos = ref([]);
const loading = ref(false);
// * 事件工单中2=待审核，0=待处理，3=处理中
// * 智飞工单中1: 待审核，2=已驳回，3=已通过
const statusMap = {
  0: '待处理',
  2: '待审核',
@@ -99,17 +115,17 @@
};
const zfstatusMap = {
  1: '待审核',
  2: '已驳回',
  3: '已通过',
};
const zfstatusMapColor = {
  1: { color: '#FF472F', backgroundImage: db2, borderLeftColor: '#FF472F' },
  2: { color: '#4200DD', backgroundImage: db5, borderLeftColor: '#4200DD' },
  3: { color: '#FF472F', backgroundImage: db2, borderLeftColor: '#FF472F' },
};
// 根据状态获取图标
const getStatusBackground = statusIndex => {
  if (
    (permission.value.device_statistics_six === true &&
      permission.value.device_statistics_four === true) ||
    permission.value.device_statistics_six === true
  ) {
  if (checked.value === '智飞工单') {
    const style = zfstatusMapColor[statusIndex];
    return style ? `url(${style.backgroundImage})` : 'none';
  } else {
@@ -118,11 +134,7 @@
  }
};
const getStatusStyle = statusIndex => {
  if (
    (permission.value.device_statistics_six === true &&
      permission.value.device_statistics_four === true) ||
    permission.value.device_statistics_six === true
  ) {
  if (checked.value === '智飞工单') {
    const style = zfstatusMapColor[statusIndex] || {
      color: '#999',
      borderLeftColor: '#999',
@@ -144,84 +156,84 @@
};
// 获取状态对应的文字颜色
const getStatusColor = statusIndex => {
  if (
    (permission.value.device_statistics_six === true &&
      permission.value.device_statistics_four === true) ||
    permission.value.device_statistics_six === true
  ) {
  if (checked.value === '智飞工单') {
    return zfstatusMapColor[statusIndex]?.color || '#999';
  } else {
    return statusMapColor[statusIndex]?.color || '#999';
  }
};
const getListMatter = async () => {
  //  console.log('permission.value', permission.value);
  if (
    (permission.value.device_statistics_six === true &&
      permission.value.device_statistics_four === true) ||
    permission.value.device_statistics_six === true
  ) {
    loading.value = true;
    // 0是智飞工单  运维
    const res = await getdaiban(0, userInfo.value.detail.areaCode);
    todos.value = res.data.data || [];
    zfTotal.value = todos.value.length
        sjTotal.value = todos.value.length
    // console.log('todos.value', todos.value);
// 跳转到对应详情页
const jumporder = val => {
  if (checked.value === '智飞工单') {
    const id = val.id;
    getaddOrderRecord(id)
    router.push({
      path: `/tickets/orderLog`,
      query: {
        id,
      },
    });
  } else {

    loading.value = false;
  } else if (
  
    // 1是事件工单
    permission.value.device_statistics_four === true &&
    permission.value.device_statistics_six !== true
  ) {
   getaddOrderRecord(val.id)
    const orderNumber = val.event_num;
    router.push({
      path: `/tickets/ticket`,
      query: {
        orderNumber,
      },
    });
  }
};
// 标记事件工单或智飞工单已读
const getaddOrderRecord = async (id) => {
const ticketId = id
  if (checked.value === '事件工单') {
    loading.value = true;
    const res = await getdaiban(1, userInfo.value.detail.areaCode);
    const type = 1;
    const res = await addOrderRecordApi(type,ticketId);  
  } else if (checked.value === '智飞工单') {
    loading.value = true;
    const type = 2;
    const res = await addOrderRecordApi(type,ticketId);
  }
};
// 获取事件工单和智飞工单的数量
const getOrderCount = async () => {
  const res = await getOrderCountApi(userInfo.value.detail.areaCode);
  const data = res.data.data
  titleList.value.forEach(item => {

  if(data[item.label] !== undefined){
    item.number = data[item.label]
  }
   
  });

};
// 获取事件工单或者智飞工单的信息
const getListMatter = async () => {
  if (checked.value === '事件工单') {
    loading.value = true;
    const type = 1;
    const res = await getOrderOrEventApi(type, userInfo.value.detail.areaCode);
    todos.value = res.data.data || [];
    console.log('todos.value1', todos.value);
    loading.value = false;
  } else if (checked.value === '智飞工单') {
    loading.value = true;
    const type = 2;
    const res = await getOrderOrEventApi(type, userInfo.value.detail.areaCode);
    todos.value = res.data.data || [];
    loading.value = false;
  }
};
// const isDataReady = computed(() => {
//   return userInfo.value.detail?.areaCode && permission.value.o_and_m_p_jump;
// });
// const autoFetchData = () => {
//   if (isDataReady.value) {
//     getListMatter();
//   }
// };
watch(
  () => [
    userInfo.value.detail?.areaCode,
    permission.value.device_statistics_four,
    permission.value.device_statistics_six,
  ],
  () => getListMatter(),
  { immediate: true }
);

const jumporder = val => {
  // if (permission.value.o_and_m_p_jump === true) {
  //   const id = val.id;
  //   router.push({
  //     path: `/tickets/orderLog`,
  //     query: {
  //       id,
  //     },
  //   });
  // } else {
  //   const orderNumber = val.event_num;
  //   router.push({
  //     path: `/tickets/ticket`,
  //     query: {
  //       orderNumber,
  //     },
  //   });
  // }
};



onMounted(() => {
  getListMatter();
  getOrderCount();
});
</script>

@@ -266,7 +278,7 @@
        border-bottom: 2px solid #1c5cff;
      }
      .dots {
        width: 13px;
        width: 23px;
        height: 13px;
        border-radius: 50%;
        background: #366fff;
@@ -330,14 +342,21 @@
        }

        .todo-text {
         font-weight: 400;
font-size: 14px;
color: #343434;
          font-weight: 400;
          font-size: 14px;
          color: #343434;
        }
        .unread {
          width: 5px;
          height: 5px;
          background: #1c5cff;
          background: #1c5cff !important;
          border-radius: 50%;
          margin: 0 4px;
        }
        .reads{
         width: 5px;
          height: 5px;
          background: transparent ;
          border-radius: 50%;
          margin: 0 4px;
        }
@@ -349,9 +368,9 @@
        margin-right: 42px;

        .todo-date {
        font-weight: 400;
font-size: 14px;
color: #5C6476;
          font-weight: 400;
          font-size: 14px;
          color: #5c6476;
          margin-left: 2px;
        }
      }