首页新增

Oliver

2022-12-22 73b48dd59a2d47b365b87784371c4ef57dde659b

首页新增

 src/views/layout/components/Main/index.vue

@@ -5,9 +5,11 @@
      <!-- 页面导航区域 -->
      <div class="page-nav" v-if="navFlag">
        <div class="nav-item" v-for="item in navList" :key="item.id">
          <div class="nav-title">{{item.title}}</div>
          <div class="nav-title">{{ item.title }}</div>
          <div class="nav-child" v-if="item.children && item.children.length!==0">
            <el-link :underline="false" class="child-item" v-for="child in item.children" @click="handleJump(child.link)" :key="child.id">{{child.label}}</el-link>
            <el-link :underline="false" class="child-item" v-for="child in item.children"
                     @click="handleJump(child.link)" :key="child.id">{{ child.label }}
            </el-link>
          </div>
        </div>
      </div>
@@ -21,6 +23,7 @@
<script>
// import MyFooter from "../Footer"
import NavBar from "../NavBar"

export default {
  name: "Main",
  components: {
@@ -30,143 +33,244 @@
  data() {
    return {
      navFlag: true,
      navList:[
      navList: [
        {
          id:1,
          title:'系统设置',
          children:[
          id: 1,
          title: '系统设置',
          children: [
            {
              id:2,
              label:'用户管理',
              link:'/system/userSetting/user',
              id: 2,
              label: '用户管理',
              link: '/system/userSetting/user',
            },
            {
              id:3,
              label:'角色管理',
              link:'/system/userSetting/role',
              id: 3,
              label: '角色管理',
              link: '/system/userSetting/role',
            },
            {
              id:4,
              label:'部门管理',
              link:'/system/userSetting/department',
              id: 4,
              label: '部门管理',
              link: '/system/userSetting/department',
            },
            {
              id:5,
              label:'卡口设备管理',
              link:'/system/device/bayonet',
              id: 4,
              label: '自定义菜单',
              link: '/system/platform/mySetting',
            },
            {
              id:6,
              label:'点位管理',
              link:'/system/device/point',
              id: 4,
              label: 'logo管理',
              link: '/system/platform/portalSetting',
            },
            {
              id: 4,
              label: '驾驶舱管理',
              link: '/system/platform/cockpitManage',
            },
            {
              id: 5,
              label: '卡口设备管理',
              link: '/system/device/bayonet',
            },
            {
              id: 6,
              label: '点位管理',
              link: '/system/device/point',
            },
            {
              id: 6,
              label: '网格管理',
              link: '/system/device/grid',
            },
            {
              id: 6,
              label: '音柱设备管理',
              link: '/system/device/loudspeaker',
            },
            {
              id: 6,
              label: '手持设备管理',
              link: '/system/device/handheldTerminal',
            },
          ]
        },
        {
          id:7,
          title:'运营管理',
          children:[
          id: 7,
          title: '运营管理',
          children: [
            {
              id:8,
              label:'案件池',
              link:'/operate/casepool/pool',
              id: 8,
              label: '违规事项设置',
              link: '/operate/baseSetting/violation',
            },
            {
              id:9,
              label:'上报管理',
              link:'/operate/casepool/escalation',
              id: 9,
              label: '违建事项设置',
              link: '/operate/baseSetting/illegalBuild',
            },
            {
              id:10,
              label:'调度管理',
              link:'/operate/casepool/dispatch',
              id: 10,
              label: '我的待办',
              link: '/operate/myWait',
            },
            {
              id:11,
              label:'审核管理',
              link:'/operate/management/myIndex',
              id: 11,
              label: '案件查询',
              link: '/operate/viewEvent',
            },
            {
              id:13,
              label:'我的待办',
              link:'/operate/myWait',
              id: 13,
              label: '门前三包',
              link: '/operate/fivepack/threepackage',
            },
            {
              id:14,
              label:'案卷查询',
              link:'/operate/viewEvent',
            },
             {
              id:15,
              label:'车辆管理',
              link:'/operate/car/carIndex',
            },
             {
              id:16,
              label:'图片管理',
              link:'/operate/images',
            },
             {
              id:17,
              label:'视频管理',
              link:'/operate/videoControl',
              id: 14,
              label: '店铺管理',
              link: '/operate/fivepack/shop',
            },
            {
              id:18,
              label:'消息管理',
              link:'/operate/message/messageIndex',
              id: 15,
              label: '车辆管理',
              link: '/operate/car/carIndex',
            },
            {
              id:19,
              label:'短信管理',
              link:'/operate/sms/smsIndex',
              id: 15,
              label: '轨迹分析(执法车)',
              link: '/operate/car/lawTrajectory',
            },
             {
              id:20,
              label:'日志管理',
              link:'/operate/log',
            {
              id: 15,
              label: '轨迹分析(渣土车)',
              link: '/operate/car/soilTrajectory',
            },
            {
              id: 16,
              label: '图片管理',
              link: '/operate/images',
            },
            {
              id: 17,
              label: '视频管理',
              link: '/operate/videoControl',
            },
            {
              id: 17,
              label: '文书管理',
              link: '/operate/writManagement/writ',
            },
            {
              id: 17,
              label: '文书模板管理',
              link: '/operate/writManagement/writTemplate',
            },
            {
              id: 18,
              label: '消息管理',
              link: '/operate/message/messageIndex',
            }, {
              id: 18,
              label: '栏目管理',
              link: '/operate/message/mycontrol',
            },
            {
              id: 19,
              label: '短信管理',
              link: '/operate/sms/smsIndex',
            }, {
              id: 19,
              label: '短信模板管理',
              link: '/operate/sms/smsTemplate',
            },
            {
              id: 20,
              label: '日志管理',
              link: '/operate/log',
            },
          ]
        },
        {
          id:21,
          title:'视频巡查',
          children:[
          id: 21,
          title: '事项处置管理',
          children: [
            {
              id:22,
              label:'视频巡查',
              link:'/video',
              id: 24,
              label: '案件池',
              link: '/operate/casepool/pool',
            }, {
              id: 24,
              label: '已上报到市',
              link: '/operate/casepool/escalation',
            }, {
              id: 24,
              label: '调度管理',
              link: '/operate/casepool/dispatch',
            }, {
              id: 24,
              label: '在学习管理',
              link: '/operate/casepool/learn',
            }, {
              id: 24,
              label: '暂不处理',
              link: '/operate/casepool/notDeal',
            },
          ]
        },
        {
          id:23,
          title:'智能巡查',
          children:[
          id: 23,
          title: '审核管理',
          children: [
            {
              id:24,
              label:'预警研判',
              link:'/studyJudge',
              id: 24,
              label: '审核管理',
              link: '/operate/management/myIndex',
            },
            {
              id:25,
              label:'违规检索',
              link:'/illegalSearch',
              id: 25,
              label: '短信审核管理',
              link: '/operate/management/managementMessage',
            },
          ]
        },
        {
          id: 23,
          title: '视频巡查',
          children: [
            {
              id: 24,
              label: '视频巡查',
              link: '/video',
            },
          ]
        },
        {
          id: 23,
          title: '智能巡查',
          children: [
            {
              id: 24,
              label: '预警研判',
              link: '/studyJudge',
            },
            {
              id:26,
              label:'趋势分析',
              link:'/trendAnalysis',
              id: 25,
              label: '违规检索',
              link: '/illegalSearch',
            },
            {
              id:27,
              label:'违章统计',
              link:'/trendAnalysis',
              id: 26,
              label: '趋势分析',
              link: '/trendAnalysis',
            },
            {
              id:28,
              label:'违法统计',
              link:'/typeStatistics',
              id: 27,
              label: '违章统计',
              link: '/trendAnalysis',
            },
            {
              id: 28,
              label: '违法统计',
              link: '/typeStatistics',
            },
          ]
        },
@@ -178,14 +282,14 @@
      newPath === '/home' ? this.navFlag = true : this.navFlag = false
    }
  },
  created(){
  created() {
    this.$route.path === '/home' ? this.navFlag = true : this.navFlag = false
  },  
  methods:{
    handleJump(url){
  },
  methods: {
    handleJump(url) {
      const baseURL = '/home'
      // 路由跳转
      this.$router.push({path:baseURL+url})
      this.$router.push({path: baseURL + url})
    }
  }
};
@@ -198,23 +302,29 @@
  .content {
    padding: 11px;
    height: 100%;
    .page-nav{

    .page-nav {
      padding: 40px 100px;
      text-align: left;
      .nav-item{

      .nav-item {
        line-height: 60px;
        .nav-title{

        .nav-title {
          color: #4b9bb7;
        }
        .nav-child{

        .nav-child {
          display: flex;
          // justify-content: space-between;
          flex-wrap: wrap;
          .el-link{

          .el-link {
            justify-content: flex-start;
            padding-left: 30px;
          }
          .child-item{

          .child-item {
            width: 24%;
            text-align: left;
            margin-bottom: 22px;
@@ -222,7 +332,8 @@
            border: 1px solid #17324c;
            color: #4b9bb7;
            position: relative;
            &::after{

            &::after {
              content: '';
              display: block;
              position: absolute;

 src/views/layout/components/Menu/index.vue

@@ -2,7 +2,7 @@
  <div>
    <!-- 侧边导航栏 -->
    <el-aside width="200px">
      <h2 class="siderbar-title">遂昌执法平台</h2>
      <h2 class="siderbar-title" @click="toHome()">遂昌执法平台</h2>
      <el-scrollbar>
        <!-- 路由 -->
        <el-menu router class="el-menu-vertical" :default-active="$route.path">
@@ -65,6 +65,7 @@

<script>
import users from "@/api/users";
import router from "@/router";

export default {
  data() {
@@ -85,6 +86,9 @@
          })
          .catch(err => this.$message.error(err))
    },
    toHome(){
      router.push("/home")
    }
  },
};
</script>
@@ -186,4 +190,4 @@
    }
  }
}
</style>
</style>