quyueting
/
manHourHousekeeper


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319
							<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta name="keywords" content="工时管理,项目工时管理,项目成本管理,工时统计,项目成本统计,工时记录表,工时统计表" />
  <meta name="description"
    content="工时管家是专业的工时管理和项目管理软件。提供工时填报，审核和工时统计功能。引进现代工时管理和项目管理的理念，核算项目投入成本准确便捷，企业IPO项目成本分摊好帮手" />
  <title>工时管理|工时记录表|项目成本管理-工时管家是强大易用的项目工时管理系统。工时填报|工时统计|手机移动填报|核算项目成本|企业IPO利器！</title>
  <link href="css/styles.css" rel="stylesheet">
  <link rel="stylesheet" href="./css/reset.css">
  <link rel="stylesheet" href="./css/customerNew/customerNew.css">
  <link rel="stylesheet" href="./css/element-uiCss.css">
  <script src="./js/vue.min.js"></script>
  <script src="./js/element-ui.js"></script>
  <script src="js/jquery1.42.min.js"></script>
  </link>
</head>

<body data-spy="scroll" data-target=".fixed-top" id="body">
  <div id="app">
    <div class="spinner-wrapper">
      <div class="spinner">
        <div class="bounce1"></div>
        <div class="bounce2"></div>
        <div class="bounce3"></div>
      </div>
    </div>
    <!-- 头部 -->
    <iframe id="headerIframe" src="./moduleView/header.html" class="iframeClass" onLoad="reinitIframe();"></iframe>

    <!-- 咨询客服 -->
    <div class="zhixun" id="zhixun" style="display: none">
      <p>微信扫码咨询</p>
      <img src="./image/codecopy.jpg" alt="">
      <p><span style="color: #595959;">客服QQ：</span>3052894409</p>
    </div>
    <!-- 咨询的图标 -->
    <div class="consulting" id="consulting">
      <img id="consultigImg" src="./image/ions/kefu2.png" alt="">
    </div>

    <!-- banner -->
    <div class="bannar">
      <img src="./image/customerNew/banner.gif" alt="" />
      <div class="bannar_text">
        <div class="bannar_text_title">客户管家</div>
        <div class="bannar_text_item">· 节约成本<br />· 提高企业营收<br />· 用高效的客户追踪系统和智能数据处理</div>
      </div>
    </div>

    <!-- 客户一体化 -->
    <div class="customer_integration">
      <div class="customer_integration_conter">
        <div class="integrationImg">
          <img src="./image/customerNew/integrationImg.png" alt="">
        </div>
        <div class="integrationText">· 客户管家,一体化智能管理</div>
      </div>
    </div>

    <!-- 核心功能 -->
    <div class="core">
      <div class="core-title">核心功能</div>
      <div class="core-text">一站式AI智能报表、客户管理、线索商机、数据分析、产品管理、个性化等功能。</div>
      <div class="core-content">
        <div class="core-content-item">
          <div class="item-img"><img src="./image/customerNew/core1.png" /></div>
          <div class="item-title">AI 智能填报</div>
          <div class="item-text">通过AI大模型对数据的理解，<br /> 根据用户描述的需求实时生成报表。</div>
        </div>
        <div class="core-content-item">
          <div class="item-img"><img src="./image/customerNew/core2.png" /></div>
          <div class="item-title">客户管理</div>
          <div class="item-text">管理客户名称、行业、地区、联系人信息等</div>
        </div>
        <div class="core-content-item">
          <div class="item-img"><img src="./image/customerNew/core3.png" /></div>
          <div class="item-title">线索商机</div>
          <div class="item-text">归纳线索信息、线索转商机、商机可能性、预期收益等</div>
        </div>
        <div class="core-content-item">
          <div class="item-img"><img src="./image/customerNew/core4.png" /></div>
          <div class="item-title">数据分析</div>
          <div class="item-text">线索分析、来源排行、商机分析、任务统计</div>
        </div>
        <div class="core-content-item">
          <div class="item-img"><img src="./image/customerNew/core5.png" /></div>
          <div class="item-title">产品管理</div>
          <div class="item-text">产品基础信息、销售时间、产品描述等</div>
        </div>
        <div class="core-content-item">
          <div class="item-img"><img src="./image/customerNew/core6.png" /></div>
          <div class="item-title">个性化</div>
          <div class="item-text">自定义组件、个性化UI等</div>
        </div>
      </div>
    </div>

    <!-- 需求 -->
    <div class="demand">
      <div class="demand-title">满足您的各类需求</div>
      <div class="demand-content">
        <img src="./image/customerNew/demand.png" alt="">
        <div class="demand-item orientation1">
          <div class="demand-item-title">
            <div class="item-title-img"><img src="./image/customerNew/demandIcon.png" alt=""></div>
            智能销售管理
          </div>
          <div class="demand-item-text">
            商机信息字段齐全并可自定义；<br />
            商机分阶段处理；<br />
            根据商机创建任务。
          </div>
        </div>

        <div class="demand-item orientation2">
          <div class="demand-item-title">
            <div class="item-title-img"><img src="./image/customerNew/demandIcon.png" alt=""></div>
            提高销售成单率
          </div>
          <div class="demand-item-text">
            商机信息字段齐全并可自定义；<br />
            商机分阶段处理；<br />
            根据商机创建任务。
          </div>
        </div>

        <div class="demand-item orientation3">
          <div class="demand-item-title">
            <div class="item-title-img"><img src="./image/customerNew/demandIcon.png" alt=""></div>
            便捷用户操作
          </div>
          <div class="demand-item-text">
            操作逻辑简单易学；<br />
            系统界面简洁明了；<br />
            内容展示完整易读。
          </div>
        </div>

        <div class="demand-item orientation4">
          <div class="demand-item-title">
            <div class="item-title-img"><img src="./image/customerNew/demandIcon.png" alt=""></div>
            降低客户流失率
          </div>
          <div class="demand-item-text">
            客户信息字段齐全并可自定义；<br />
            客户回访创建；<br />
            客户问题记录。
          </div>
        </div>

        <div class="demand-item orientation5">
          <div class="demand-item-title">
            <div class="item-title-img"><img src="./image/customerNew/demandIcon.png" alt=""></div>
            提高线索转化率
          </div>
          <div class="demand-item-text">
            线索信息字段齐全并可自定义；<br />
            根据线索创建任务；<br />
            线索长时间未转化自动加入公共池。
          </div>
        </div>

        <div class="demand-item orientation6">
          <div class="demand-item-title">
            <div class="item-title-img"><img src="./image/customerNew/demandIcon.png" alt=""></div>
            缩短销售周期
          </div>
          <div class="demand-item-text">
            全流程清晰明了；<br />
            可创建任务协同工作；<br />
            设置提醒防止遗漏。
          </div>
        </div>
      </div>
    </div>

    <!-- 特色展示 -->
    <div class="exhibition">
      <div class="exhibition-title">特色展示</div>
      <div class="exhibition-content">
        <div class="exhibition-item">
          <div class="exhibition-item-line">
            <div :class="`optFor`" :style="`top: ${exhibitionTop}`"></div>
          </div>
          <div class="exhibition-item-text">
            <div :class="`text ${exhibitionIndex == index ? 'text-On' : ''}`" v-for="(item,index) in exhibitionList"
              :key="index" @click="changeExhibitionIndex(index)">{{item.label}}</div>
          </div>
        </div>
        <div class="exhibition-show">
          <div class="exhibition-show-carouselImage">
            <el-carousel ref="exhibitionRef" direction="vertical" :autoplay="false" arrow="never" height="37.6875rem" indicator-position="none">
              <el-carousel-item v-for="(item, index) in exhibitionList" :key="index">
                <img :src="item.img" />
              </el-carousel-item>
            </el-carousel>
          </div>
        </div>
      </div>
    </div>

    <!-- 行业解决方案 -->
    <div class="solution">
      <div class="solution-title">行业解决方案</div>
      <div class="solution-content">
        <div class="solution-item" v-for="(item, index) in solutionList" :key="index">
          <div class="solution-item-title">{{ item.title }}</div>
          <div class="solution-item-text">{{ item.text }}</div>
        </div>
      </div>
    </div>

    <!-- 客户评价 -->
    <div class="customerReviews">
      <div class="customerReviews-title">客户评价</div>
      <div class="customerReviews-content">
        <div class="carouselImage">
          <el-carousel ref="carouselRef" :interval="5000" height="37.5rem" arrow="never" indicator-position="none">
            <el-carousel-item v-for="item in carouselImageList" :key="item">
              <img :src="item"></img>
            </el-carousel-item>
          </el-carousel>
        </div>
        <!-- 左右箭头 -->
        <div class="icon left" @click="prev()"><img src="./image/customerNew/left.png" alt=""></div>
        <div class="icon right" @click="next()"><img src="./image/customerNew/right.png" alt=""></div>
      </div>
    </div>

    <!-- 底部 -->
    <iframe id="bottomIframe" src="./moduleView/bottom.html" class="resetIframe resetIframebtn"></iframe>
  </div>
</body>
<script>
  new Vue({
    el: "#app",
    data: {
      exhibitionIndex: 0,
      exhibitionList: [
        { label: '线索', img: './image/customerNew/exhibitionListImg1.png' },
        { label: '商机', img: './image/customerNew/exhibitionListImg2.png' },
        { label: '客户', img: './image/customerNew/exhibitionListImg3.png' },
        { label: '任务', img: './image/customerNew/exhibitionListImg4.png' },
        { label: '报表', img: './image/customerNew/exhibitionListImg5.png' },
        { label: '产品', img: './image/customerNew/exhibitionListImg6.png' },
        { label: '联系人', img: './image/customerNew/exhibitionListImg7.png' },
        { label: '数据分析', img: './image/customerNew/exhibitionListImg8.png' },
        { label: '销售订单', img: './image/customerNew/exhibitionListImg9.png' },
        { label: '组织机构', img: './image/customerNew/exhibitionListImg10.png' },
        { label: '系统基础设置', img: './image/customerNew/exhibitionListImg11.png' },
      ],
      solutionList: [
        { title: '生产制造业', text: '机械制造业、电子信息制造业、汽车制造业、化工制造业、纺织制造业和食品加工业等。' },
        { title: '互联网行业', text: '互联网服务、电子商务、在线娱乐、数字内容、信息技术、人工智能等。' },
        { title: '家居装修行业', text: '设计、建筑施工、建材生产、装饰及家具产品制造等。' },
        { title: '医疗医药行业', text: '各类医疗机构、药品、医疗器械等。' },
        { title: '外贸行业', text: '商品贸易、服务贸易、技术贸易、跨国投资等。' },
        { title: '高科技技术制造业', text: '电子信息制造业、航空航天制造业、生物医药制造业、新能源与环保制造业等。' },
        { title: '教育培训行业', text: '学校教育、职业教育、语言培训、艺术教育等。' },
        { title: '金融行业', text: '银行业、保险业、证券业、基金业、期货与期权业等。' },
        { title: 'IT软件行业', text: '软件开发、硬件制造、云计算、大数据、人工智能等。' },
        { title: '物流行业', text: '运输、仓储、配送、信息管理等。' },
      ],
      carouselImageList: [
        'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
        'https://fuss10.elemecdn.com/1/34/19aa98b1fcb2781c4fba33d850549jpeg.jpeg',
        'https://fuss10.elemecdn.com/0/6f/e35ff375812e6b0020b6b4e8f9583jpeg.jpeg',
        'https://fuss10.elemecdn.com/9/bb/e27858e973f5d7d3904835f46abbdjpeg.jpeg',
        'https://fuss10.elemecdn.com/d/e6/c4d93a3805b3ce3f323f7974e6f78jpeg.jpeg',
        'https://fuss10.elemecdn.com/3/28/bbf893f792f03a54408b3b7a7ebf0jpeg.jpeg',
        'https://fuss10.elemecdn.com/2/11/6535bcfb26e4c79b48ddde44f4b6fjpeg.jpeg'
      ]
    },
    computed: {
      exhibitionTop() {
        return `${this.exhibitionIndex * 80}px`
      }
    },
    mounted() {
    },
    methods: {
      prev() {
        this.$refs.carouselRef.prev()
      },
      next() {
        this.$refs.carouselRef.next()
      },
      changeExhibitionIndex(index) {
        console.log(index, '<==== 点击的索引')
        this.$refs.exhibitionRef.setActiveItem(index)
        this.exhibitionIndex = index
      }
    },
  })
</script>

<script src="js/js/jquery.min.js"></script>
<script src="js/js/scripts.js"></script>
<script src="js/iframe.js"></script>
<script>
  $('#zhixun').hover(function () {
    $("#zhixun").show()
    $("#consultigImg").attr("src", './image/ions/kefu1.png')
  }, function () {
    $("#zhixun").hide()
    $("#consultigImg").attr("src", './image/ions/kefu2.png')
  })
  $('#consulting').hover(function () {
    $("#zhixun").show()
    $("#consultigImg").attr("src", './image/ions/kefu1.png')
  }, function () {
    $("#zhixun").hide()
    $("#consultigImg").attr("src", './image/ions/kefu2.png')
  })
</script>
</html>