首页值班

src/api/datascreen.ts

@@ -27,6 +27,18 @@ export function dutyDay(params: Record<string, any>) {
     return request.get({ url:  '/dataScreen/dutyDay', params})
 }
 
+export function dutyIndex() {
+    return request.get({ url:  '/system/dept/dutyIndex'})
+}
+
+export function getDept() {
+    return request.get({ url:  '/system/dept/getLevel'})
+}
+
+export function getDutyName() {
+    return request.get({ url:  '/system/dept/getDuty'})
+}
+
 export function threeRate(params: Record<string, any>) {
     return request.get({ url:  '/dataScreen/threeRate', params})
 }

src/views/home/Index.vue

@@ -13,7 +13,9 @@
                 <MailTable />
             </el-col>
             <el-col :span="6">
-                <Duty />
+                <Duty v-if ="level == 1"/>
+                <DutyFj v-if ="level == 2"/>
+                <DutySj v-if = "level == 3"/>
             </el-col>
         </el-row>
         <DataStatistics />
@@ -24,7 +26,16 @@ import Overall from "./components/Overall.vue";
 import Daily from "./components/Daily.vue";
 import MailTable from "./components/MailTable.vue";
 import Duty from "./components/Duty.vue";
+import DutyFj from "./components/DutyFj.vue";
+import DutySj from "./components/DutySj.vue";
 import DataStatistics from "./components/DataStatistics.vue";
+import {getDept} from  '@/api/datascreen';
+const level = ref("")
+getDept().then(data => {
+    level.value = data.level
+    console.log("SSSSSSSSSSSSSS"+level.value);
+})
+
 </script>
 <style lang="scss" scoped>
 .container {

src/views/home/components/DutyFj.vue

@@ -0,0 +1,101 @@
+<template>
+    <h1>今日值班</h1>
+    
+    <el-tabs v-model="activeName">
+        <el-scrollbar style="height: 350px;">
+        <el-tab-pane label="市局专班" name="sj">
+            <div class="flex item between" v-for="item in duty.dutySjList" :key="item.id">
+                <div>{{ item.departName }}</div>
+                <div class="primary">
+                    <span class="mr-18">{{ item.policeName }}</span>
+                    <span>{{ item.mobile }}</span>
+                </div>
+            </div>
+            <el-empty v-if="!duty.dutySjList.length"></el-empty>
+        </el-tab-pane>
+        <el-tab-pane label="本单位" name="fx">
+            <div class="flex item between" v-for="item in duty.dutyFjList" :key="item.id">
+                <div>{{ item.departName }}</div>
+                <div class="primary">
+                    <span class="mr-18">{{ item.policeName }}</span>
+                    <span>{{ item.mobile }}</span>
+                </div>
+            </div>
+            <el-empty v-if="!duty.dutyFjList.length"></el-empty>
+        </el-tab-pane>
+        <el-tab-pane label="大队" name="zd">
+            <div class="flex item between" v-for="item in duty.dutyDdList" :key="item.id">
+                <div>{{ item.departName }}</div>
+                <div class="primary">
+                    <span class="mr-18">{{ item.policeName }}</span>
+                    <span>{{ item.mobile }}</span>
+                </div>
+            </div>
+            <el-empty v-if="!duty.dutyDdList.length"></el-empty>
+        </el-tab-pane>
+        <el-tab-pane label="派出所" name="bw">
+            <div class="flex item between" v-for="item in duty.dutyPcsList" :key="item.id">
+                <div>{{ item.departName }}</div>
+                <div class="primary">
+                    <span class="mr-18">{{ item.policeName }}</span>
+                    <span>{{ item.mobile }}</span>
+                </div>
+            </div>
+            <el-empty v-if="!duty.dutyPcsList.length"></el-empty>
+        </el-tab-pane>
+    </el-scrollbar>
+    </el-tabs>
+
+</template>
+<script setup>
+import { dutyIndex } from '@/api/datascreen'
+import { useRouter } from "vue-router";
+import { dutyDay } from '@/api/datascreen'
+const router = useRouter();
+const activeName = ref('sj')
+
+const duty = ref({
+    dutySjList: [],
+    dutyFjList: [],
+    dutyDdList: [],
+    dutyPcsList: [],
+})
+dutyIndex().then(data => {
+    console.log("SSSSSSSSSSSSSS");
+    duty.value = data
+})
+</script>
+<style lang="scss" scoped>
+.item {
+    height: 60px;
+    line-height: 60px;
+    box-shadow: inset 0px -1px 0px 0px #E8EBFF;
+    color: #999;
+    padding: 0 16px;
+    .primary {
+        color: #000;
+    }
+}
+.el-tabs {
+    :deep() {
+        .el-tabs__header {
+            margin: 0;
+
+            .el-tabs__nav {
+                padding-bottom: 16px;
+
+                .el-tabs__item {
+                    font-weight: 700;
+                }
+            }
+        }
+        .el-tabs__active-bar {
+            height: 4px;
+        }
+        .el-tabs__item {
+            --el-font-size-base: 18px;
+            --el-text-color-primary: #999;
+        }
+    }
+}
+</style>

src/views/home/components/DutySj.vue

@@ -0,0 +1,100 @@
+<template>
+    <h1>今日值班</h1>
+    
+    <el-tabs v-model="activeName">
+        <el-scrollbar style="height: 350px;">
+        <el-tab-pane label="市局专班" name="sj">
+            <div class="flex item between" v-for="item in duty.dutySjList" :key="item.id">
+                <div>{{ item.departName }}</div>
+                <div class="primary">
+                    <span class="mr-18">{{ item.policeName }}</span>
+                    <span>{{ item.mobile }}</span>
+                </div>
+            </div>
+            <el-empty v-if="duty.dutyPcsList==null||!duty.dutySjList.length"></el-empty>
+        </el-tab-pane>
+        <el-tab-pane :label=labelNames.FDepartName name="fx">
+            <div class="flex item between" v-for="item in duty.dutyFjList" :key="item.id">
+                <div>{{ item.departName }}</div>
+                <div class="primary">
+                    <span class="mr-18">{{ item.policeName }}</span>
+                    <span>{{ item.mobile }}</span>
+                </div>
+            </div>
+            <el-empty v-if="!duty.dutyFjList.length"></el-empty>
+        </el-tab-pane>
+        <el-tab-pane label="本单位" name="bw">
+            <div class="flex item between" v-for="item in duty.dutyPcsList" :key="item.id">
+                <div>{{ item.departName }}</div>
+                <div class="primary">
+                    <span class="mr-18">{{ item.policeName }}</span>
+                    <span>{{ item.mobile }}</span>
+                </div>
+            </div>
+            <el-empty v-if="duty.dutyPcsList==null||!duty.dutyFjList.length"></el-empty>
+        </el-tab-pane>
+    </el-scrollbar>
+    </el-tabs>
+
+</template>
+<script setup>
+
+import { useRouter } from "vue-router";
+import { dutyDay } from '@/api/datascreen'
+const router = useRouter();
+const activeName = ref('sj')
+import {getDept,getDutyName,dutyIndex} from  '@/api/datascreen';
+const level = ref("")
+const labelName = ref("")
+
+const labelNames = ref({
+    FDepartName: "",
+    DepartName: "",
+})
+const duty = ref({
+    dutySjList: [],
+    dutyFjList: [],
+    dutyPcsList: [],
+})
+dutyIndex().then(data => {
+    console.log("SSSSSSSSSSSSSS");
+    duty.value = data
+})
+getDutyName().then(data => {
+    labelNames.value = data
+})
+</script>
+<style lang="scss" scoped>
+.item {
+    height: 60px;
+    line-height: 60px;
+    box-shadow: inset 0px -1px 0px 0px #E8EBFF;
+    color: #999;
+    padding: 0 16px;
+    .primary {
+        color: #000;
+    }
+}
+.el-tabs {
+    :deep() {
+        .el-tabs__header {
+            margin: 0;
+
+            .el-tabs__nav {
+                padding-bottom: 16px;
+
+                .el-tabs__item {
+                    font-weight: 700;
+                }
+            }
+        }
+        .el-tabs__active-bar {
+            height: 4px;
+        }
+        .el-tabs__item {
+            --el-font-size-base: 18px;
+            --el-text-color-primary: #999;
+        }
+    }
+}
+</style>