policeSecurity/collect_information/src/pages/projectManager/index/index.vue

<template>
  <view>
    <view class="swiperDemo">
      <nut-swiper ref="swiperRef" pagination-visible pagination-color="#e53e31" :auto-play="3000" :init-page="0">
        <nut-swiper-item v-for="(item, index) in list" :key="index" style="height: 180px">
          <image :src="item" alt="" style="height: 100%; width: 100%" draggable="false"/>
          <view>1123</view>
        </nut-swiper-item>
      </nut-swiper>
    </view>
    <view class="nameTitle">
      <view class="itemSchool" >
        <text>单位数量</text>
        <text
            style=" white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 80px;text-align: center">51</text>
      </view>
      <view class="itemSchool">
        <text>服务项目</text>
        <text>
          13123
        </text>
      </view>
      <view class="itemSchool">
        <text>有保安证人员</text>
        <text> 1000</text>
      </view>
      <view class="itemSchool">
        <text>无保安证人员</text>
        <text> 140</text>
      </view>
    </view>
    <view class="swiperDemoItem">
      <view class="swiperDemoIndex"></view>
      <view>请选择</view>
    </view>
    <!--九宫格-->
    <view class="Module">
      <view class="subModule" >
        <view class="subModuleItem" v-for="item in subModuleList" :key="item.id"
              @click="subNavigation(item.url)">
          <view class="subModuleIndex">
            <image :src="item.icon"></image>
          </view>
          <view style=" font-size: 12px;color: #414141;margin-top: 5px">{{item.name}}</view>
        </view>
      </view>
    </view>
    <view style="background-color: #e9eef4;height: 15rpx"></view>

  </view>
</template>
<script setup lang="ts">
import {ref} from 'vue'
import Taro from "@tarojs/taro";
import icon from '@/assets/images/project.png'
import icon01 from '@/assets/images/回单.jpg'
import icon02 from '@/assets/images/工单.jpg'
import icon03 from '@/assets/images/排名.jpg'
import icon04 from '@/assets/images/法制宣传.jpg'
import icon06 from '@/assets/images/警保风采.jpg'

import './index.scss'
const list = ref([process.env.TARO_APP_MINIO_URL + '/police-security/2024/11/5/dunpai.jpg'])
const swiperRef = ref() //轮播图
const subModuleList = ref([
  {
    id: 0,
    icon: icon,
    name: '项目管理',
    url: '/subPages/projectManager/myProject/myProject'
  },
  {
    id: 1,
    icon: icon02,
    name: '整改工单',
    url: ''
  },
  {
    id: 2,
    icon: icon03,
    name: '考核排名',
    url: ''
  },
  {
    id: 3,
    icon: icon06,
    name: '警保风采',
    url: ''
  },
  {
    id: 4,
    icon: icon04,
    name: '法制宣传',
    url: ''
  },
  {
    id: 5,
    icon: icon01,
    name: '整改回单',
    url: ''
  }
])

const subNavigation = async (url: string) => Taro.navigateTo({url})

</script>