From 233e4fc4f35bd00a36ee34a7fbf5e47b41db26db Mon Sep 17 00:00:00 2001
From: chenyao <1219716595@qq.com>
Date: Mon, 17 Nov 2025 09:54:44 +0800
Subject: [PATCH] feat：更新初始化地形
---
src/views/wel/components/backlog.vue | 113 +++++++++++++++++++++++++++++++-------------------------
1 files changed, 63 insertions(+), 50 deletions(-)
diff --git a/src/views/wel/components/backlog.vue b/src/views/wel/components/backlog.vue
index 19ad663..c106d5c 100644
--- a/src/views/wel/components/backlog.vue
+++ b/src/views/wel/components/backlog.vue
@@ -9,13 +9,13 @@
<div>
{{ item.name }}
<div class="dots">{{ item.number >= 100 ? '99+' : item.number }}</div>
- <!-- <div class="dots">99+</div> -->
+
</div>
</div>
</div>
</div>
- <div class="todo-items" v-if="todos.length > 0" v-loading="loading">
+ <div class="todo-items" v-if="todos.length > 0" v-loading="loading" element-loading-background="rgba(255, 255, 255, 0.5)">
<div v-for="(item, index) in todos" :key="index" class="todo-item" :style="getStatusStyle(item.status)"
@click="jumporder(item)">
<div class="status-indicator"><img :src="getStatus(item.status)" alt=""></div>
@@ -30,9 +30,10 @@
</div>
<div class="action-area">
- <!-- <img :src="st7" alt="" /> -->
- <!-- <span class="todo-date">{{ item.date?.slice(0, 10).replace(/-/g, '.') }}</span> -->
- <span class="todo-date">{{ item.name }}</span>
+ <!-- <span class="todo-date">{{ item.name }}</span> -->
+ <el-tooltip effect="dark" :content="item.name" placement="top">
+ <span class="todo-date">{{item.name}}</span>
+ </el-tooltip>
</div>
</div>
</div>
@@ -49,7 +50,7 @@
</template>
<script setup>
-import st7 from '@/assets/images/workbench/st7.svg'
+
import db1 from '@/assets/images/workbench/db1.svg'
import db2 from '@/assets/images/workbench/db2.svg'
import db3 from '@/assets/images/workbench/db3.svg'
@@ -59,12 +60,17 @@
import { onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { useStore } from 'vuex'
-const zfTotal = ref(0)
-const sjTotal = ref(0)
+const userInfo = computed(() => store.getters.userInfo)
+const todos = ref([])
+const loading = ref(false)
const router = useRouter()
const store = useStore()
const permission = computed(() => store.getters.permission)
const checked = ref('事件工单')
+const todosCache = reactive({
+ '事件工单': [],
+ '智飞工单': []
+})
const titleList = ref([
{
label: 'event_order_count',
@@ -77,14 +83,13 @@
number: 0,
},
])
-const titleClick = (item, index) => {
+
+const titleClick = async (item, index) => {
+todos.value =[]
checked.value = item.name
- getListMatter()
+ await getListMatter()
}
-const userInfo = computed(() => store.getters.userInfo)
-const todos = ref([])
-const loading = ref(false)
// * 事件工单中2=待审核，0=待处理，3=处理中
// * 智飞工单中1: 待审核，2=已驳回，3=已通过
const statusMap = {
@@ -107,16 +112,7 @@
2: { color: '#4200DD', backgroundImage: db5, borderLeftColor: '#4200DD' },
3: { color: '#FF472F', backgroundImage: db2, borderLeftColor: '#FF472F' },
}
-// 根据状态获取图标
-// const getStatusBackground = statusIndex => {
-// if (checked.value === '智飞工单') {
-// const style = zfstatusMapColor[statusIndex];
-// return style ? `url(${style.backgroundImage})` : 'none';
-// } else {
-// const style = statusMapColor[statusIndex];
-// return style ? `url(${style.backgroundImage})` : 'none';
-// }
-// };
+
const getStatus = statusIndex => {
if (checked.value === '智飞工单') {
const style = zfstatusMapColor[statusIndex]
@@ -160,7 +156,7 @@
if (checked.value === '智飞工单') {
const id = val.id
getaddOrderRecord(id)
- router.push({
+ router.replace({
path: `/tickets/orderLog`,
query: {
id,
@@ -169,12 +165,10 @@
} else {
getaddOrderRecord(val.id)
const orderNumber = val.event_num
- router.push({
- path: `/tickets/ticket`,
- query: {
- orderNumber,
- },
- })
+ router.replace({
+ path: `/tickets/ticket`,
+ query: { orderNumber },
+})
}
}
// 标记事件工单或智飞工单已读
@@ -203,24 +197,28 @@
})
}
// 获取事件工单或者智飞工单的信息
+
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 || []
+ loading.value = true
+ const type = checked.value === '事件工单' ? 1 : 2
+
+ // 使用缓存数据
+ if (todosCache[checked.value].length > 0) {
+ todos.value = todosCache[checked.value]
+ }
+ const todosParams = {
+ type:type,
+ area_code: userInfo.value.detail.areaCode,
+ }
+ try {
+ const res = await getOrderOrEventApi(todosParams)
+ const data = res.data.data || []
+ todos.value = data.sort((a, b) => a.is_read - b.is_read)
+ todosCache[checked.value] = todos.value
+ } finally {
loading.value = false
- // console.log('事件工单', todos.value);
- } 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
- // console.log('智飞工单', todos.value);
}
}
-
onMounted(() => {
getListMatter()
getOrderCount()
@@ -235,7 +233,7 @@
.bocklogBox {
width: 100%;
// height: 306px;
- height: pxToVh(326);
+ height: pxToVh(316);
background: rgba(255, 255, 255, 0.41);
box-shadow: 0px 3px 4px -1px rgba(125, 125, 125, 0.25);
border-radius: 8px 8px 8px 8px;
@@ -313,12 +311,19 @@
.todo-items {
margin-top: 10px;
- // height: 250px;
+ transition: opacity 0.3s ease;
height: pxToVh(250);
overflow-y: scroll;
+ &:empty {
+ display: none;
+ }
}
.todo-item {
+ transition:
+ transform 0.2s ease,
+ box-shadow 0.2s ease,
+ opacity 0.3s ease;
margin: 6px 0;
display: flex;
align-items: center;
@@ -394,7 +399,7 @@
.action-area {
display: flex;
align-items: center;
- margin-right: 42px;
+ margin-right: 22px;
img {
width: 15px;
@@ -403,9 +408,14 @@
.todo-date {
font-weight: 400;
- font-size: 14px;
-color: #343434;
- margin-left: 2px;
+ font-size: 14px;
+ color: #343434;
+ margin-left: 2px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ max-width: 200px;
+ display: inline-block;
}
}
}
@@ -415,5 +425,8 @@
font-size: 14px;
color: #7c8091;
}
+ .el-empty {
+ transition: opacity 0.3s ease;
+}
}
</style>
--
Gitblit v1.9.3