import React, { useEffect, useReducer, useRef, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import './index.less'
import shengjie from './img/shengjie.png'
import xianjie from './img/xianjie.png'
import shengjigonglu from './img/shengjigonglu.png'
import yinshuigongcheng from './img/yinshuigongcheng.png'
import xian from './img/xian.png'


export default function TuLi() {

  return (
    <div className='homePage_tuli2'>
        <div className='homePage_tuli2_title'>图例</div>
        <div className='homePage_tuli2_row'>
            <div className='homePage_tuli2_row_item'>
                <div className='homePage_tuli2_row_item_icon'>
                    <img width={45} height={4} src={`${process.env.PUBLIC_URL}/assets/xyt/homeImg/shengjie.png`} alt="" />
                </div>
                <div className='homePage_tuli2_row_item_text'>省(直辖市)界</div>
            </div>
            <div className='homePage_tuli2_row_item'>
                <div className='homePage_tuli2_row_item_icon2'>
                    <img width={13} height={13} src={`${process.env.PUBLIC_URL}/assets/xyt/homeImg/shi.png`} alt="" />
                </div>
                <div className='homePage_tuli2_row_item_text2'>红安县</div>
            </div>
        </div>

        <div className='homePage_tuli2_row'>
            <div className='homePage_tuli2_row_item'>
                <div className='homePage_tuli2_row_item_icon'>
                    <img width={45} height={4} src={`${process.env.PUBLIC_URL}/assets/xyt/homeImg/xianjie.png`} alt="" />
                </div>
                <div className='homePage_tuli2_row_item_text'>县(市)界</div>
            </div>
            <div className='homePage_tuli2_row_item'>
                <div className='homePage_tuli2_row_item_icon2'>
                    <img width={13} height={13} src={`${process.env.PUBLIC_URL}/assets/xyt/homeImg/xian.png`} alt="" />
                </div>
                <div className='homePage_tuli2_row_item_text2'>乡、镇政府所在地</div>
            </div>
        </div>


        <div className='homePage_tuli2_row'>
            <div className='homePage_tuli2_row_item'>
                <div className='homePage_tuli2_row_item_icon'>
                    <img width={45} height={4} src={`${process.env.PUBLIC_URL}/assets/xyt/homeImg/gonglu.png`} alt="" />
                </div>
                <div className='homePage_tuli2_row_item_text'>省级公路</div>
            </div>
            <div className='homePage_tuli2_row_item'>
                <div className='homePage_tuli2_row_item_icon2'>
                    <img width={13} height={13} src={`${process.env.PUBLIC_URL}/assets/xyt/homeImg/cun.png`} alt="" />
                </div>
                <div className='homePage_tuli2_row_item_text2'>村委所在地</div>
            </div>
        </div>    


        <div className='homePage_tuli2_row'>
            <div className='homePage_tuli2_row_item'>
                <div className='homePage_tuli2_row_item_icon'>
                    <img width={45} height={4} src={`${process.env.PUBLIC_URL}/assets/xyt/homeImg/heliu.svg`} alt="" />
                </div>
                <div className='homePage_tuli2_row_item_text'>河流</div>
            </div>
            <div className='homePage_tuli2_row_item'>
                <div className='homePage_tuli2_row_item_icon2'>
                    <img width={13} height={13} src={`${process.env.PUBLIC_URL}/assets/xyt/homeImg/weixianqu.svg`} alt="" />
                </div>
                <div className='homePage_tuli2_row_item_text2'>危险区</div>
            </div>
        </div>   

        <div className='homePage_tuli2_row'>
            <div className='homePage_tuli2_row_item'>
                <div className='homePage_tuli2_row_item_icon'>
                    <img width={16} height={16} src={`${process.env.PUBLIC_URL}/assets/xyt/homeImg/anzhidian.png`} alt="" style={{marginLeft:'15px'}}/>
                </div>
                <div className='homePage_tuli2_row_item_text'>安置点</div>
            </div>
            <div className='homePage_tuli2_row_item'>
                <div className='homePage_tuli2_row_item_icon2'>
                    <img width={13} height={13} src={`${process.env.PUBLIC_URL}/assets/xyt/homeImg/qishiyedanwei.svg`} alt="" />
                </div>
                <div className='homePage_tuli2_row_item_text2'>企事业单位</div>
            </div>
        </div>   

        <div className='homePage_tuli2_row'>
            <div className='homePage_tuli2_row_item'>
                <div className='homePage_tuli2_row_item_icon'>
                    <img width={16} height={16} src={`${process.env.PUBLIC_URL}/assets/xyt/homeImg/yanhejuminhu.png`} alt="" style={{marginLeft:'15px'}}/>
                </div>
                <div className='homePage_tuli2_row_item_text'>沿河居民户</div>
            </div>
            <div className='homePage_tuli2_row_item'>
            </div>
        </div>       
    </div>
  );
}