完成 督察组页面展示

src/api/inspect.js

@@ -1,4 +1,9 @@
 import request from "@/utils/request";
+import { useAppStore } from "@/stores/app";
+import { useUserStore } from "@/stores/user";
+
+const appStore = useAppStore()
+const userStore = useUserStore()
 
 /**
  * 获取当前督察组
@@ -17,10 +22,11 @@ export function getCurrGroup(pid) {
  * @param {*} pid 督察类型
  */
 export function getInspBaseByPersid(pid) {
-    const ownApp = '2'
+    const ownApp = appStore.ownApp
+    const userid = userStore.userId
     return request({
         url: '/dc/insp/base/getByPersid',
         method: 'GET',
-        params: { pid, ownApp,  }
+        params: { pid, ownApp, userid, tabType: 0 }
     })
 }

src/assets/styles/filter.scss

@@ -15,6 +15,10 @@
       }
   
     }
+
+    .filter-item + .filter-item {
+      margin-left: 10px;
+    }
   
   }
   

src/components/GwSelect.vue

@@ -0,0 +1,52 @@
+<template>
+    <div class="filter-item">
+        <div class="filter-btn" @click="showPicker = true">
+            {{ getTypeName(props.value) }}
+            <van-icon name="arrow-down" color="#ebecf0" size="1rem" />
+        </div>
+        <van-popup v-model:show="showPicker" round position="bottom">
+            <van-picker :columns="props.columns" @cancel="showPicker = false" @confirm="onConfirm" />
+        </van-popup>
+    </div>
+</template>
+<script setup>
+import { ref, defineProps, defineEmits } from "vue";
+
+const emits = defineEmits(['update:value']);
+
+const props = defineProps({
+    columns: {
+        type: Array,
+        default: () => [],
+    },
+    value: {
+        type: null,
+    }
+})
+
+const showPicker = ref(false);
+const onConfirm = ({ selectedOptions }) => {
+    showPicker.value = false;
+    emits('update:value', selectedOptions[0].value);
+};
+
+function getTypeName(code) {
+    if (!code) return '';
+    return props.columns.find(item => item.value === code)?.text;
+}
+</script>
+<style lang="scss" scoped>
+@import '@/assets/styles/filter.scss';
+
+.content-wrapper {
+    padding-top: 8px;
+    height: 100%;
+    overflow: auto;
+
+    .ducha-group-wrapper {
+        height: calc(100% - 35px);
+        overflow: auto;
+    }
+
+}
+</style>

src/components/list01.vue

@@ -1,17 +1,21 @@
 <template>
     <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
-        <card01 v-for="item in list" :key="item" :title="item + ''" icon="notes" :description="item + ''" />
+        <card01 v-for="item in list" :key="item" :title="item.prsnTitle + ''" icon="notes"
+            :description="`时间：${item.sttm} 至 ${item.entm}`" />
     </van-list>
 </template>
 <script setup>
-import { ref, defineProps } from 'vue';
+import { ref, defineProps, watch } from 'vue';
 import card01 from './card01.vue';
-import { getCurrGroup } from '@/api/inspect.js';
+import { getCurrGroup, getInspBaseByPersid } from '@/api/inspect.js';
 
 const props = defineProps({
     type: {
         type: String,
     },
+    batch: {
+        type: String,
+    },
 })
 
 
@@ -19,11 +23,26 @@ const list = ref([]);
 const loading = ref(false);
 const finished = ref(false);
 
-const onLoad = () => {
-    getCurrGroup(props.type).then(res => {
-        list.value = res.data;
-        loading.value = false;
-        finished.value = true;
-    })
-};
+function onLoad() {
+    if (props.type === 'history' && props.batch) {
+        getInspBaseByPersid(props.batch).then(res => {
+            list.value = res.data;
+        debugger
+            loading.value = false;
+            finished.value = true;
+        })
+    } else {
+        getCurrGroup(props.batch).then(res => {
+            list.value = res.data;
+            loading.value = false;
+            finished.value = true;
+        })
+    }
+}
+
+watch(() => props.batch, batch => {
+    if (batch) {
+        onLoad()
+    }
+})
 </script>

src/stores/app.js

@@ -2,6 +2,10 @@ import { defineStore } from 'pinia'
 import { ref } from 'vue'
 
 export const useAppStore = defineStore('app', () => {
+  // 当前机构
   const currentOrgId = ref('034')
-  return {currentOrgId}
+  // 当前应用 督察：1；稽查：2；
+  const ownApp = ref('2')
+
+  return {currentOrgId, ownApp}
 })

src/views/Inspect/current.vue

@@ -1,40 +1,20 @@
 <template>
     <div class="content-wrapper">
         <div class="filter-wrapper">
-            <div class="filter-item">
-                <div class="filter-btn" @click="showPicker = true">
-                    {{ getTypeName(fieldValue) }}
-                    <van-icon name="arrow-down" color="#ebecf0" size="1rem" />
-                </div>
-            </div>
+            <gw-select :columns="inspectTypes" v-model:value="inspectType" />
         </div>
-        <van-popup v-model:show="showPicker" round position="bottom">
-            <van-picker :columns="columns" @cancel="showPicker = false" @confirm="onConfirm" />
-        </van-popup>
-        <list01 class="ducha-group-wrapper" :type="fieldValue"></list01>
+        <list01 class="ducha-group-wrapper" type="current" :batch="inspectType"></list01>
     </div>
 </template>
 <script setup>
-import { onMounted, ref } from "vue";
-import CurrentComponent from "./current.vue";
+import { ref } from "vue";
+import GwSelect from "@/components/GwSelect.vue";
 import List01 from "@/components/list01.vue";
-import { showToast } from 'vant';
 
-const columns = [
+const inspectTypes = [
     { text: '稽查工作', value: '008' },
 ];
-const fieldValue = ref('008');
-const showPicker = ref(false);
-
-const onConfirm = ({ selectedOptions }) => {
-    showPicker.value = false;
-    fieldValue.value = selectedOptions[0].value;
-};
-
-function getTypeName(code) {
-    if (!code) return '';
-    return columns.find(item => item.value === code)?.text;
-}
+const inspectType = ref('008');
 </script>
 <style lang="scss" scoped>
 @import '@/assets/styles/filter.scss';

src/views/Inspect/history.vue

@@ -0,0 +1,66 @@
+<template>
+    <div class="content-wrapper">
+        <div class="filter-wrapper">
+            <gw-select :columns="inspectTypes" v-model:value="inspectType" />
+            <gw-select :columns="baseBatchs" v-model:value="baseBatch" />
+            <gw-select :columns="twoBatchs" v-model:value="twoBatch" />
+        </div>
+        <list01 class="inspect-group-wrapper" type="history" :batch="twoBatch"></list01>
+    </div>
+</template>
+<script setup>
+import { onMounted, ref, watch } from "vue";
+import List01 from "@/components/list01.vue";
+import GwSelect from "@/components/GwSelect.vue";
+import { getInspBaseByPersid } from "@/api/inspect";
+
+const inspectType = ref('008');
+const inspectTypes = [{ text: '稽查工作', value: '008' }];
+
+const baseBatch = ref(null);
+const baseBatchs = ref([]);
+
+const twoBatch = ref(null);
+const twoBatchs = ref([]);
+
+function getInspBase(value, level = 1) {
+    // 获取批次
+    getInspBaseByPersid(value).then(res => {
+        if (level === 2) {
+            twoBatchs.value = res.data.map(item => ({ text: item.prsnTitle, value: item.plnaId })).reverse();
+            twoBatch.value = twoBatchs.value[0].value;
+            return;
+        }
+        baseBatchs.value = res.data.map(item => ({ text: item.prsnTitle, value: item.plnaId }));
+        baseBatch.value = baseBatchs.value[0].value;
+        // getInspBase(baseBatch.value, 2);
+    });
+}
+
+onMounted(() => {
+    getInspBase(inspectType.value)
+});
+
+
+watch(() => inspectType, inspectType => {
+    getInspBase(inspectType.value);
+})
+watch(() => baseBatch, baseBatch => {
+    getInspBase(baseBatch.value, 2);
+}, { deep: true, immediate: true })
+</script>
+<style lang="scss" scoped>
+@import '@/assets/styles/filter.scss';
+
+.content-wrapper {
+    padding-top: 8px;
+    height: 100%;
+    overflow: auto;
+
+    .inspect-group-wrapper {
+        height: calc(100% - 35px);
+        overflow: auto;
+    }
+
+}
+</style>

src/views/Inspect/index.vue

@@ -4,12 +4,14 @@
       <current-component></current-component>
     </van-tab>
     <van-tab title="历史">
+      <history-component></history-component>
     </van-tab>
   </van-tabs>
 </template>
 <script setup>
-import { onMounted, ref } from "vue";
+import { ref } from "vue";
 import CurrentComponent from "./current.vue";
+import HistoryComponent from "./history.vue";
 import { showToast } from 'vant';
 
 const active = ref('当前');