<template>
  <div >
    <div class="banner">
      <p class="banner-title">关于我们</p >
      <p class="banner-des">智慧停车，助你轻松出行我</p >
    </div>
    <h1>关于我们</h1>
    <p class="about-main">
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;黄石市智慧停车项目以“互联网+停车”思维将民生服务智慧化，通过开发城市级智慧停车综合管理与信息服务平台，对现有道路停车泊位进行智能化改造，对现有各类停车场进行整合联网，建设城区三级停车诱导系统，有效引导公众交通计划出行。车主可通过手机停车APP、道路停车诱导屏等方式查询空余泊位信息，便捷高效驾驶于城区各主次干道。同时根据城市智慧停车建设专项规划，结合重点区域停车需求，新建改造一批停车场（泊位），力争3年内，全面建成城市智慧停车系统。
    </p>
    <p class="about-main">
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;黄石市智慧停车项目通过加强城市停车设施建设和管理，实现停车供需矛盾明显缓解，停车环境明显改善，泊位利用率明显提高，最终打造一个以互联网、物联网信息技术运用为基础，以经营管理和数字化运营为核心的城市及静态交通管理平台，共同驱动黄石市交通服务体系的升级，推动黄石市停车产业向高质量、可持续的方向发展。
    </p>
    <p class="about-main">
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;黄石市统一的智慧停车综合管理与信息服务平台，对黄石市主城区道路停车泊位智能化建设、路外公共停车场智能化改造、城区停车诱导系统建设，同时结合云计算、物联网、移动支付、智能识别等相关技术，最终建设形成一个面向市民的停车服务体系，和一个面向管理者的停车管理体系。
    </p>
    <h1 >工作机会</h1 >
    <ul class="work-list">
      <li>
        <p class="work-title">【招聘职位】总裁秘书</p >
        <p class="work-date">发布时间：2019/05/28</p >
        <div class="n_cont">

          <p>岗位职责：</p >

          <p>1.负责协调总经理与公司内外部的沟通，传达贯彻总经理对公司内外部工作的管理思想和领导意图；</p >

          <p>2. 参与公司发展规划、业务经营计划的编制和公司重大决策的讨论。协助各部门将相关汇报、意见、建议反馈给总经理；</p >

          <p>3. 负责总裁有关文件的起草、修改、审核，整理各类文书、文件、报告、总结及其他材料；</p >

          <p>4. 负责总裁管辖范围内工作进度的跟进、督促，处理与反馈。</p >

          <p>&nbsp;</p >

          <p>&nbsp;</p >

          <p>任职要求：</p >

          <p>1.大学本科及以上学历，经济管理、文秘、英语等相关专业；</p >

          <p>2.3年以上同类企业文秘工作经验，能熟练的英文对话交流；</p >

          <p>3.掌握文秘知识，熟悉公文写作知识，熟练使用办公软件；</p >

          <p>4.具有一定的组织能力、协调能力、沟通能力、分析能力、语言表达能力和文公写作能力。</p >

        </div>
      </li>
      <li>
        <p class="work-title">【招聘职位】销售总监</p >
        <p class="work-date">发布时间：2019/05/28</p >
        <div class="n_cont">

          <p>岗位职责：</p >
          <p>1、负责销售团队管理，带领团队完成销售目标、业绩指标、销售收入、合同回款及项目结案；</p >

          <p>2、负责所辖区域（新老客户）或专注产品的市场、销售及项目运作；</p >

          <p>3、协调并整合公司内部及外部资源，推进计划达成，满足客户需求及公司业绩经营目标要求</p >

          <p>4、负责公司分派的项目/客户运作；</p >

          <p>&nbsp;</p >

          <p>&nbsp;</p >

          <p>任职要求：</p >
          <p>1、从事智能交通、智能停车、数字城管、智慧城市等相关领域或公安、交管、城管、一卡通、停车行业等的市场销售2年以上工作经验，并有独立运作合同的谈判、沟通、运作、签署与履约实施经历；</p >

          <p>2、具备独立开拓区域市场与销售成交的经验及相应能力，具备销售市场综合素养与技巧能力；</p >



        </div>
      </li>
    </ul>
    <h1>联系我们</h1>
    <h3>“黄石停车”融合智能交通、移动互联网、物联网以及电子支付等技术</h3>
    <ul class="contact-list">
      <li>
        <p>电话</p >
        <p>0714-653588</p >
      </li>
      <li>
        <p>传真</p >
        <p>0714-653538222</p >
      </li>
      <li>
        <p>邮箱</p >
        <p>hsci@sina.com</p >
      </li>
    </ul>
    <div id="map" class="map"></div>
  </div>
</template>

<script>
  export default {
    name: 'about',
    mounted() {
      // 百度地图API功能
      var sContent = '<div style="margin:0;line-height:20px;padding:2px;">' +
        '<h3 style="font-size: 15px;color: #CC2727;font-weight: 600">黄石市城市发展投资集团有限公司</h3> ' +
        '<span style="font-weight: 600;">地址</span>：湖北省黄石市磁湖东路28号<br/>' +
        '<span style="font-weight: 600;">邮编</span>：435000<br/>' +
        '<span style="font-weight: 600;">电话</span>：0714—6535388<br/>' +
        '<span style="font-weight: 600;">传真</span>：0714—653538222<br/>' +
        '<span style="font-weight: 600;">邮箱</span>：hsci@sina.com<br/>' +
        '</div>';
      var map = new BMap.Map("map");
      var point = new BMap.Point(115.078186, 30.232887);
      var point1 = new BMap.Point(115.078186, 30.230887);
      var marker = new BMap.Marker(point1); //创建marker对象

      map.addOverlay(marker); //在地图中添加marker

      map.centerAndZoom(point, 15);
      map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
      var top_left_control = new BMap.ScaleControl({anchor: BMAP_ANCHOR_TOP_LEFT});// 左上角，添加比例尺
      var top_left_navigation = new BMap.NavigationControl();  //左上角，添加默认缩放平移控件
      var top_right_navigation = new BMap.NavigationControl({anchor: BMAP_ANCHOR_TOP_RIGHT, type: BMAP_NAVIGATION_CONTROL_SMALL}); //右上角，仅包含平移和缩放按钮
      map.addControl(top_left_control);
      map.addControl(top_left_navigation);
      map.addControl(top_right_navigation);
      var infoWindow = new BMap.InfoWindow(sContent);  // 创建信息窗口对象
      map.openInfoWindow(infoWindow, point); //开启信息窗口
    }
  }
</script>

<style scoped lang="scss">

  .banner {
    background: url("../assets/about/banner.png") no-repeat;
    background-size: 100% 100%;
    text-align: left;
    .banner-title {
      width: 1200px;
      margin: 0 auto;
      padding: 200px 0 30px;
      font-size: 65px;
      font-weight: bold;
      color: rgba(255, 255, 255, 1);
    }
    .banner-des {
      width: 1200px;
      margin: 0 auto;
      font-size: 20px;
      font-weight: 500;
      color: rgba(255, 255, 255, 1);
      letter-spacing: 2px;
    }
  }
  .about-m-title {
    padding: 30px 0 0px;
    font-size: 42px;
    font-weight: 600;
    color:rgba(51,51,51,1);
  }
  .about-main{
    width: 1200px;
    margin: 0px auto;
    line-height: 24px;
    color: #5a5a5a;
    text-align: left;
  }
  h1 {
    padding: 30px 0 20px;
    font-size: 38px;
    font-weight: 600;
    color: rgba(49, 70, 89, 1);
  }

  h3 {
    font-size: 16px;
    font-weight: 300;
    color: rgba(49, 70, 89, 1);
  }

  .work-list {
    width: 1200px;
    margin: 10px auto;
    color: #5a5a5a;
    display: flex;
    > li {
      flex: 1;
    }
  }

  .work-title{
    color: #1d50a2;
    font-size: 20px;
  }

  .work-date{
    margin: 10px auto;
  }

  .n_cont{
    max-width: 550px;
    text-align: left;
    line-height: 20px;
  }

  .contact-list {
    width: 1200px;
    margin: 30px auto;
    overflow: hidden;
    font-size: 20px;
    color: #314659;
    text-align: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-content: space-between;
    li {
      flex: 1;
      padding-left: 106px;
      height: 80px;
      position: relative;
      &:before {
        content: '';
        position: absolute;
        width: 80px;
        height: 80px;
        left: 0;
        top: 0;
      }
      &:nth-of-type(1):before {
        background: url("../assets/about/tel.png");
      }
      &:nth-of-type(2):before {
        background: url("../assets/about/fax.png");
      }
      &:nth-of-type(3):before {
        background: url("../assets/about/email.png");
      }
      p:nth-of-type(1) {
        margin: 20px 0 10px;
      }
    }
  }

  .map {
    width: 1200px;
    height: 472px;
    margin: 0 auto 30px;
    z-index: 999;
  }
</style>
