|
@@ -3,10 +3,19 @@
|
|
|
<div class="center_bottom-title flex">
|
|
|
<div class="flex items-center">
|
|
|
<img src="@/assets/img/home/title_arrow.png" alt="" />
|
|
|
- 今日工单概览
|
|
|
+ <span :class="{ active: active === '0' }" @click="active = '0'"
|
|
|
+ >今日工单概览</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ class="ml-14"
|
|
|
+ :class="{ active: active === '1' }"
|
|
|
+ @click="active = '1'"
|
|
|
+ v-if="['ZiGong'].includes(themeConfig.appScope)"
|
|
|
+ >今日二次办理工单概览</span
|
|
|
+ >
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="center_bottom-content">
|
|
|
+ <div class="center_bottom-content" v-if="active === '0'">
|
|
|
<div class="table-header">
|
|
|
<div class="table-header-item">超期状态</div>
|
|
|
<div class="table-header-item">来源</div>
|
|
@@ -50,13 +59,56 @@
|
|
|
<empty v-else />
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class="center_bottom-content" v-if="active === '1'">
|
|
|
+ <div class="table-header">
|
|
|
+ <div class="table-header-item">超期状态</div>
|
|
|
+ <div class="table-header-item">工单状态</div>
|
|
|
+ <div class="table-header-item">标题</div>
|
|
|
+ <div class="table-header-item">申请部门</div>
|
|
|
+ <div class="table-header-item">申请时间</div>
|
|
|
+ <div class="table-header-item">受理类型</div>
|
|
|
+ </div>
|
|
|
+ <div class="scroll" v-loading="loading">
|
|
|
+ <vue3-seamless-scroll
|
|
|
+ :list="shList"
|
|
|
+ hover
|
|
|
+ :singleHeight="100"
|
|
|
+ v-if="shList.length"
|
|
|
+ >
|
|
|
+ <div class="item" v-for="(item, index) in shList" :key="index">
|
|
|
+ <span>
|
|
|
+ <span class="exceedSoon" v-if="item.order?.expiredStatus === 1">{{
|
|
|
+ item.order?.expiredStatusText
|
|
|
+ }}</span>
|
|
|
+ <span class="exceed" v-if="item.order?.expiredStatus === 2">{{
|
|
|
+ item.order?.expiredStatusText
|
|
|
+ }}</span>
|
|
|
+ <span class="normal" v-if="item.order?.expiredStatus === 0">{{
|
|
|
+ item.order?.expiredStatusText
|
|
|
+ }}</span>
|
|
|
+ </span>
|
|
|
+ <TextTooltip :content="item.order?.statusText"></TextTooltip>
|
|
|
+ <TextTooltip :content="item.order?.title"></TextTooltip>
|
|
|
+ <TextTooltip :content="item.applyOrgName"></TextTooltip>
|
|
|
+ <TextTooltip
|
|
|
+ :content="formatDate(item.creationTime, 'YYYY-mm-dd HH:MM:SS')"
|
|
|
+ ></TextTooltip>
|
|
|
+ <TextTooltip :content="item.order?.acceptType"></TextTooltip>
|
|
|
+ </div>
|
|
|
+ </vue3-seamless-scroll>
|
|
|
+ <empty v-else />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script setup lang="ts">
|
|
|
import { ref, onMounted, onUnmounted, defineAsyncComponent } from "vue";
|
|
|
import { Vue3SeamlessScroll } from "vue3-seamless-scroll";
|
|
|
-import { orderView } from "api/home";
|
|
|
+import { orderView, secondaryHandling } from "api/home";
|
|
|
import signalR from "@/utils/signalR";
|
|
|
+import { useThemeConfig } from "@/stores/themeConfig";
|
|
|
+import { storeToRefs } from "pinia";
|
|
|
+import { formatDate } from "@/utils/formatTime";
|
|
|
|
|
|
const TextTooltip = defineAsyncComponent(
|
|
|
() => import("@/components/TextTooltip/index.vue")
|
|
@@ -64,6 +116,10 @@ const TextTooltip = defineAsyncComponent(
|
|
|
const Empty = defineAsyncComponent(
|
|
|
() => import("@/components/Empty/index.vue")
|
|
|
);
|
|
|
+
|
|
|
+const storesThemeConfig = useThemeConfig();
|
|
|
+const { themeConfig } = storeToRefs(storesThemeConfig);
|
|
|
+const active = ref("0");
|
|
|
const list = ref([]);
|
|
|
const loading = ref(false);
|
|
|
const getData = async () => {
|
|
@@ -77,12 +133,31 @@ const getData = async () => {
|
|
|
loading.value = false;
|
|
|
}
|
|
|
};
|
|
|
+// 获取二次办理概览
|
|
|
+const shList = ref([]);
|
|
|
+const getSecondHandling = async () => {
|
|
|
+ loading.value = true;
|
|
|
+ try {
|
|
|
+ const { result } = await secondaryHandling();
|
|
|
+ shList.value = result;
|
|
|
+ loading.value = false;
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e);
|
|
|
+ loading.value = false;
|
|
|
+ }
|
|
|
+};
|
|
|
onMounted(() => {
|
|
|
// 接收消息
|
|
|
signalR.SR.on("orderHandlingDetail", (res: any) => {
|
|
|
list.value = res;
|
|
|
});
|
|
|
+ signalR.SR.on("OrderSecondaryHandlingDetail", (res: any) => {
|
|
|
+ shList.value = res;
|
|
|
+ });
|
|
|
getData();
|
|
|
+ if (["ZiGong"].includes(themeConfig.value.appScope)) {
|
|
|
+ getSecondHandling();
|
|
|
+ }
|
|
|
});
|
|
|
onUnmounted(() => {
|
|
|
// 取消接收消息
|
|
@@ -101,10 +176,20 @@ onUnmounted(() => {
|
|
|
}
|
|
|
|
|
|
&-title {
|
|
|
- font-size: 20px;
|
|
|
color: #fff;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
+ span {
|
|
|
+ cursor: pointer;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 18px;
|
|
|
+ &.active {
|
|
|
+ color: #fff;
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: bold;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
&-content {
|