事件工单url地址参数获取相关处理

shuishen

2025-05-10 cfe5aa547b00e0d6fbc1ae83ebfb91ebce41619c

 src/views/wel/components/backlog.vue

@@ -9,19 +9,19 @@
          :key="index"
          class="todo-item"
          :class="`status-${item.status}`"
          @click="jumporder()"
          @click="jumporder(item)"
        >
          <div class="status-indicator"></div>

          <div class="content-wrapper">
            <div class="main-content">
              <span class="status-tag">{{ statusMap[item.status] }}</span>
              <span class="todo-text">{{ item.title }}</span>
              <span class="todo-text">{{ item.event_name || item.dept_name}}</span>
            </div>

            <div class="action-area">
              <img :src="st7" alt="">
              <span class="todo-date">{{ item.date }}</span>
              <img :src="st7" alt="" />
              <span class="todo-date">{{ item.job_create_time?.slice(0, 10) || item.begin_time?.slice(0, 10)}}</span>
            </div>
          </div>
        </div>
@@ -31,46 +31,53 @@
</template>

<script setup>
import st7 from '@/assets/images/workbench/st7.png'
// 状态显示映射
const statusMap = {
  pending: '待审核',
  processing: '处理中',
  todo: '待处理',
};
import st7 from '@/assets/images/workbench/st7.png';
import { getList } from '@/api/tickets/ticket';
import { getList as getListLog } from '@/api/tickets/orderLog';
import { onMounted } from 'vue';
import { useRouter } from 'vue-router';
import { useStore } from 'vuex';
const router = useRouter();
const store = useStore();
const permission = computed(() => store.getters.permission);
console.log(permission.value.o_and_m_p_jump, 'permission');
const todos = ref([]);
const jumporder = val => {
  console.log('tiao', val);

// 待办事项数据
const todos = ref([
  {
    status: 'pending',
    title: '发现暴露垃圾事件',
    date: '2025.03.26',
  },
  {
    status: 'todo',
    title: '发现暴露垃圾事件',
    date: '2025.03.26',
  },
  {
    status: 'processing',
    title: '发现暴露垃圾事件',
    date: '2025.03.26',
  },
  {
    status: 'pending',
    title: '发现暴露垃圾事件',
    date: '2025.03.26',
  },
  {
    status: 'todo',
    title: '发现暴露垃圾事件',
    date: '2025.03.26',
  },
]);
const jumporder=()=>{
  console.log('tiao');
  
}
  console.log('orderNumber', orderNumber);
  if (permission.value.o_and_m_p_jump === true) {
    const orderNumber = val.job_info_num;
    router.push({
      path: `/tickets/orderLog?orderNumber=${orderNumber}`,
    });
  } else {
    const orderNumber = val.event_num;
    router.push({
      path: `/tickets/ticket?orderNumber=${orderNumber}`,
    });
  }
};
const statusMap = {
  2: '待审核',
  3: '处理中',
  0: '待处理',
  4: '已完成',
};
const getListMatter = async () => {
  if (permission.value.o_and_m_p_jump === true) {
    const res = await getListLog({});
    console.log('2222', res.data.data.records);

    todos.value = res.data.data.records?.slice(0, 5);
  } else {
    const res = await getList({});
    todos.value = res.data.data.records?.slice(0, 5);
  }
};
onMounted(() => {
  getListMatter();
});
</script>

<style lang="scss" scoped>
@@ -98,8 +105,8 @@
    .todo-item {
      display: flex;
      align-items: center;

     background: #FFFFFF;
      cursor: pointer;
      background: #ffffff;
      border-radius: 8px;
      box-shadow: 0px 2px 4px 0px rgba(173, 173, 173, 0.18);
      transition: all 0.2s ease;
@@ -148,40 +155,38 @@
      .action-area {
        display: flex;
        align-items: center;
     margin-right: 42px;
        margin-right: 42px;

        .todo-date {
          color: #666;
          font-size: 0.9rem;
        }

      
      }
    }

    // 状态颜色方案
    .status-pending {
      border-left-color: #FF6560;
      color: #FF6560;
    .status-2 {
      border-left-color: #ff6560;
      color: #ff6560;
      .status-indicator {
        background: #FF6560;
        background: #ff6560;
      }
    }

    .status-todo {
      border-left-color: #5D77FB;
      color: #5D77FB;
    .status-0 {
      border-left-color: #5d77fb;
      color: #5d77fb;
      .status-indicator {
        background: #5D77FB;
        background: #5d77fb;
      }
    }

    .status-processing {
      border-left-color: #FF8B26;
      color: #FF8B26;
    .status-3 {
      border-left-color: #ff8b26;
      color: #ff8b26;

      .status-indicator {
        background: #FF8B26;
        background: #ff8b26;
      }
    }
  }