nsgk_mobile/src/views/lawEnforcement/index_new.vue

<template>
  <div class="app-container">
    <div class="header">
      <img src="../../../static/images/lawEnforcement/new/index_icon_01.png" width="30" height="30"/>
      <p style="">埇桥区农业综合行政执法大队</p>
    </div>

    <div class="search">
      <img src="../../../static/images/lawEnforcement/new/index_icon_03.png">
      <input type="text" placeholder="请输入执法依据名称" v-model="searchInput" />
      <img src="../../../static/images/lawEnforcement/new/index_icon_04.png" @click="goSearch">
    </div>

<!--    <van-notice-bar left-icon="../../../static/images/lawEnforcement/new/index_icon_02.png" :scrollable="false" background="rgba(135,174,241,0.3)" color="#2574E9">-->
<!--      <van-swipe-->
<!--        vertical-->
<!--        class="notice-swipe"-->
<!--        :autoplay="3000"-->
<!--        :show-indicators="false"-->
<!--      >-->
<!--        <van-swipe-item>冬季种子市场摸底调查活动，截止日期10.5日！1</van-swipe-item>-->
<!--        <van-swipe-item>冬季种子市场摸底调查活动，截止日期10.5日！2</van-swipe-item>-->
<!--        <van-swipe-item>冬季种子市场摸底调查活动，截止日期10.5日！3</van-swipe-item>-->
<!--      </van-swipe>-->
<!--    </van-notice-bar>-->

    <div class="main1">
      <p class="tit">日常执法</p>
<!--      <p class="content">农业农村管理方面法律及法规规定的行政处罚</p>-->
      <van-grid :column-num="3" :border="false">
        <van-grid-item :to="{name:'lawEnforcementCaseAllocation'}">
          <img src="../../../static/images/lawEnforcement/new/index_icon_05.png"/>
          <p>案件分配</p>
        </van-grid-item>
        <van-grid-item :to="{name:'lawEnforcementTask'}">
          <img src="../../../static/images/lawEnforcement/new/index_icon_06.png"/>
          <p>任务查看</p>
        </van-grid-item>
        <van-grid-item :to="{name:'lawEnforcementCaseListNew'}">
          <img src="../../../static/images/lawEnforcement/new/index_icon_07.png"/>
          <p>巡查登记</p>
        </van-grid-item>
      </van-grid>
    </div>

    <div class="main2">
      <p class="tit">文书制作</p>

      <table width="100%">
        <tr>
          <td><img src="../../../static/images/lawEnforcement/new/index_icon_08.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'1'}})"></td>
          <td><img src="../../../static/images/lawEnforcement/new/index_icon_09.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'2'}})"></td>
          <td rowspan="2"><img src="../../../static/images/lawEnforcement/new/index_icon_12.png" @click="$router.push({name:'lawEnforcementRecordDocument'})"></td>
        </tr>
        <tr>
          <td><img src="../../../static/images/lawEnforcement/new/index_icon_10.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'3'}})"></td>
          <td><img src="../../../static/images/lawEnforcement/new/index_icon_11.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'4'}})"></td>
        </tr>
      </table>
<!--      <van-row>-->
<!--        <van-col><img src="../../../static/images/lawEnforcement/new/index_icon_08.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'1'}})"></van-col>-->
<!--        <van-col><img src="../../../static/images/lawEnforcement/new/index_icon_09.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'1'}})"></van-col>-->
<!--        <van-col><img src="../../../static/images/lawEnforcement/new/index_icon_12.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'1'}})"></van-col>-->
<!--      </van-row>-->

<!--      <van-row>-->
<!--        <van-col><img src="../../../static/images/lawEnforcement/new/index_icon_10.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'1'}})"></van-col>-->
<!--        <van-col><img src="../../../static/images/lawEnforcement/new/index_icon_11.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'1'}})"></van-col>-->
<!--      </van-row>-->
<!--      <div class="content">-->
<!--        <div class="images">-->
<!--          <img src="../../../static/images/lawEnforcement/new/index_icon_08.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'1'}})">-->
<!--          <img src="../../../static/images/lawEnforcement/new/index_icon_09.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'2'}})">-->
<!--          <img src="../../../static/images/lawEnforcement/new/index_icon_10.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'3'}})">-->
<!--          <img src="../../../static/images/lawEnforcement/new/index_icon_11.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'4'}})">-->
<!--        </div>-->
<!--        <img src="../../../static/images/lawEnforcement/new/index_icon_12.png" @click="$router.push({name:'lawEnforcementRecordDocument'})">-->
<!--      </div>-->
    </div>

    <div class="main3">
      <p class="tit">案件分析</p>
      <van-grid :column-num="3" :border="false">
        <van-grid-item :to="{name:'lawEnforcementCaseQuery'}">
          <img src="../../../static/images/lawEnforcement/new/index_icon_13.png"/>
          <p>案件查询</p>
        </van-grid-item>
        <van-grid-item :to="{name:'lawEnforcementCaseStatistics'}">
          <img src="../../../static/images/lawEnforcement/new/index_icon_14.png"/>
          <p>案件统计</p>
        </van-grid-item>
        <van-grid-item :to="{name:'lawEnforcementCaseDistributionMap'}">
          <img src="../../../static/images/lawEnforcement/new/index_icon_15.png"/>
          <p>案件分布</p>
        </van-grid-item>
      </van-grid>
    </div>

    <div class="main4">
      <p class="tit">监管对象</p>
      <div class="images">
        <img src="../../../static/images/lawEnforcement/new/index_icon_16.png" @click="$router.push({name:'lawEnforcementIndividual'})">
        <img src="../../../static/images/lawEnforcement/new/index_icon_17.png" @click="$router.push({name:'lawEnforcementEnterprise'})">
      </div>
    </div>

    <div class="main5">
      <p class="tit">执法依据</p>
      <div class="images">
        <img src="../../../static/images/lawEnforcement/new/index_icon_20.png" @click="$router.push({name:'lawEnforcementBasis'})">
      </div>
    </div>

    <div style="height: 20PX"></div>
    <lawNew></lawNew>
  </div>
</template>
<script>
import request from "@/utils/request";
import { getTopDeptId , news , scheme , communicate } from "@/api/lawEnforcement/index";
import lawNew from "@/components/common/lawNew_footer";
export default {
  name: "index",
  components: {
    lawNew
  },
  data() {
    return {
      //是否显示加载
      loading: false,
      //是否滚动到底部
      finished: false,
      searchInput:'',
      //查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 5,
        deptId:100,
        number:2
      },
    };
  },
  created() {

  },
  watch: {

  },
  methods: {
    goSearch(){
      this.$router.push({name:'lawEnforcementBasis',query:{searchInput:this.searchInput}});
    }
  },
};
</script>

<style scoped lang="scss">
.app-container {
  padding: 0 ;
}
.main2 table{
  margin-top: 15PX;
  td img{
    width: 100%;
  }
}
::-webkit-input-placeholder { color:#C9C9C9;}
:-moz-placeholder {color:#C9C9C9;}
::-moz-placeholder { color:#C9C9C9;}
:-ms-input-placeholder { color:#C9C9C9;}
.header{
  display: flex;
  background: #ffffff;
  padding: 4% 5%;
  box-shadow: 0 3Px 6Px rgba(22,70,141,0.15);
  p{
    line-height: 30Px;
    margin-left: 6Px;
    font-size: 16Px;
    color: #666666;
    font-family: SourceHanSansCNBold;
  }
}
.search{
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 88%;
  margin: 15PX auto;
  border: 1px solid #1D6FE9;
  padding: 1PX 1PX 1PX 12PX ;
  border-radius: 50PX;
  input{
    flex: 1;
    background: transparent;
    border-left: 1px solid #C9C9C9;
    padding-left: 12PX;
    margin-left: 12PX;
  }
}
.notice-swipe {
  height: 40px;
  line-height: 40px;
}
/deep/ .van-icon__image{
  width: 22PX;
  height: 22PX;
}
/deep/ .van-notice-bar{
  width: 94%;
  margin: 0 auto;
  border-radius: 5PX;
}
.tit{
  font-weight: bold;
  font-size: 16PX;
  padding: 0 2%;
  background: url("../../../static/images/lawEnforcement/new/index_icon_18.png") no-repeat left center;
  line-height: 1;
}
.main1{
  width: 92%;
  padding: 0 3%;
  margin: 25PX auto 0;
  .content{
    color: #878787;
    padding-left: 2%;
    margin-top: 10PX;
  }
  /deep/ .van-grid-item__content{
    background: transparent;
    p{
      color: #333333;
      font-size: 14PX;
    }
  }
}
.main2{
  width: 92%;
  padding: 15PX 3% 3%;
  margin: 0 auto 25PX;
  box-shadow: 0px 3PX 6PX rgba(0,0,0,0.16);
  background: #ffffff;
  border-radius: 5PX;
  .content{
    display: flex;
    justify-content: space-between;
    margin-top: 15PX;
  }
  .images{
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
    justify-content: space-between;
    flex: 1;
    margin-right: 10PX;
  }
}
.main3{
  width: 92%;
  padding: 0 3%;
  margin: 25PX auto 0;
  /deep/ .van-grid{
    justify-content: space-between;
    margin-top: 15PX;
  }
  /deep/ .van-grid-item{
    flex-basis: 31%!important;
    box-shadow: 0px 3PX 6PX rgba(0,0,0,0.16);
    border-radius: 5PX;
    overflow: hidden;
  }
  /deep/ .van-grid-item__content{
    p{
      color: #333333;
      font-size: 14PX;
      margin-top: 10PX;
    }
  }
}
.main4{
  width: 92%;
  margin: 25PX auto 0;
  .tit{
    margin-left: 3%;
  }
  .images{
    display: flex;
    justify-content: space-between;
    margin-top: 10PX;
    img{
      display: block;
      width: 50%;
    }
  }
}
.main5{
  width: 92%;
  margin: 10PX auto 0;
  .tit{
    margin-left: 3%;
  }
  .images{
    display: flex;
    justify-content: space-between;
    margin-top: 15PX;
    img{
      display: block;
      width: 100%;
    }
  }
}
</style>