uniProject/pages/admin/zijiazheng/index.vue

<template>
	<view class="phone-zjzgs-page">
		<view class="icon-title-navBar-box">
			<view @click="goUpPage" class="nav-bar-icon"></view>
			<text class="nav-bar-title">子家政公司</text>
		</view>
		<view class="jiazheng-search-box">
			<uni-datetime-picker v-model="data.range" type="daterange" @change="onDateSelect" style="flex: 1" class="yishou-date-box"/>
		</view>
		<view class="zjzgs-body-box">
			<view class="zjzgs-num-box" v-for="item in data.list" :key="item.jzId">
				<view class="zjzgs-title">{{ item.jzName }}</view>
				<view class="num-item-box">
					<view>家政人员数量：{{ item.userCount }}</view>
					<view class="num-btn" @click="checkUser(item)">详情</view>
				</view>
				<view class="num-item-box">
					<view>申请办证数量:{{ item.applyCount }}</view>
					<view class="num-btn" @click="checkApplyCert(item)">详情</view>
				</view>
				<view class="num-item-box">
					<view>已办证数量:{{ item.certCount }}</view>
					<view class="num-btn" @click="checkCert(item)">详情</view>
				</view>
			</view>
		</view> 
	</view>
</template>

<script setup>
import * as httpApi from "@/api/zijiazhenggongsi"
	import {
		reactive,
		ref
	} from "vue";

	const data = reactive({
		list: [], // 办证列表
		startDate: '', 
		endDate: '', 
		range: []
	})
	function goUpPage() {
		uni.redirectTo({
			url: `/pages/admin/ShouYe/shouye`
		})
	}
  function onDateSelect(data1) {
    getZigongsiList(data1)
  }
  function getZigongsiList() {
    httpApi.getZiJiazhengGongsiList({
      endDate: data.range[1],
      startDate: data.range[0]
    }).then(res => {
      console.log('res',res)
      data.list = res.data;
    })
  }

function checkUser(item) {}
function checkApplyCert(item) {
	uni.redirectTo({
		url: `/pages/admin/zijiazheng/banzhengshuliang?listIds=${item.applyList.join(',')}`
	})
}
function checkCert(item) {
	uni.redirectTo({
		url: `/pages/admin/zijiazheng/banzhengshuliang?listIds=${item.certList.join(',')}`
	})
}

</script>

<style>
</style>