Przeglądaj źródła

Merge branch 'master' of http://47.100.37.243:10080/wutt/manHourHousekeeper into master

seyason 4 lat temu
rodzic
commit
a7fd4a8750

+ 97 - 0
fhKeeper/formulahousekeeper/inva_4_tivo/css/revision.css

@@ -0,0 +1,97 @@
+.pricing {
+    background: #f3f7fd;
+    padding: 7.876rem 0 2.25rem 0; 
+}
+.scheme {
+    display: flex;
+    justify-content: center;
+    margin-bottom: 2.55rem;
+}
+.subject {
+    display: flex;
+    justify-content: space-around;
+}
+
+.common {
+    width: 32%;
+    box-sizing: border-box;
+    border: 1px solid #dddddd;
+    /* display: flex; */
+    /* flex-direction: column-reverse; */
+    background: #ffffff;
+    transition:all 1s ease-out;
+}
+.subject a {
+    color: #fff;
+    text-decoration:none
+}
+.common .upper {
+    text-align: center;
+    padding-top: 2.2rem;
+    border-bottom: 1px solid #dddddd;
+    position: relative;
+}
+.common .upper span {
+    display: inline-block;
+    width: 6rem;
+    height: 2rem;
+    background: #03a9f5;
+    line-height: 2rem;
+    color: #ffffff;
+    margin-top: .4rem;
+    margin-bottom: 1.6rem;
+    transition:all 0.5s ease-out;
+}
+
+.sale::after {
+    content: "*热销*";
+    position: absolute;
+    top: .4rem;
+    left: 43%;
+    font-size: 14px;
+    color: #15c381;
+}
+
+.common .upper p {
+    margin-bottom: 0.75rem;
+}
+
+.middle {
+    padding: 1.6rem 1.2rem 0 1.2rem;
+    height: 16rem;
+    border-bottom: 1px solid #dddddd;
+}
+.middle i, .whole i {
+    display: inline-block;
+    margin-right: .4rem;
+}
+
+.whole {
+    height: 32rem;
+    padding: 1.6rem 1.2rem 0 1.2rem;
+}
+
+.total {
+    color: #f26522;
+}
+
+.customization {
+    text-align: center;
+    margin: 6.6rem 0 3.2rem 0;
+}
+
+.simple:hover, .basics:hover, .specialty:hover{
+    cursor:pointer;
+    background: #eafdf3;
+    border: 1px dashed #5abf87;
+    transform:scale(1.05);
+}
+.simple:hover .upper span, .basics:hover .upper span, .specialty:hover .upper span {
+    background: #f0483e;
+}
+
+/* 弹出层样式 */
+.popups {
+    position: absolute;
+    /* background: ; */
+}

+ 112 - 4
fhKeeper/formulahousekeeper/inva_4_tivo/index.html

@@ -14,6 +14,8 @@
 	<link href="css/magnific-popup.css" rel="stylesheet">
 	<link href="css/styles.css" rel="stylesheet">
     <link rel="icon" href="images/favicon.png">
+    <!-- 定价方案(改版)样式 -->
+    <link rel="stylesheet" href="./css/revision.css">
     <script>
         var _hmt = _hmt || [];
         (function() {
@@ -93,6 +95,9 @@
         </div>
     </nav>
 
+    <!-- 弹出层 -->
+    <div class="popups"></div>
+    <!-- 弹出层 -->
     <header id="header" class="header">
         <div class="header-content">
             <div class="container">
@@ -107,16 +112,17 @@
                             </div>
                             <p class="p-large">为工时填报/审核/统计提供专业解决方案,支持PC端、微信和钉钉。基于项目/部门/人员<b>多维度统计</b>工时,实现可视化工时数据展示。</p>
                             <p class="p-large">OKR项目管理方案践行者,实现高度灵活且配合紧密的团队协作</p>
-                            <div class="col-lg-9 col-md-9 col-xl-9" style="margin: 0 auto;">
-                                <a class="btn-solid-lg btn-solid-lg-white page-scroll overload" style="margin-right: 5rem;">软件演示
+                            <div class="col-lg-9 col-md-9 col-xl-9" style="margin: 0 auto;display: flex;justify-content: space-around;">
+                                <a class="btn-solid-lg btn-solid-lg-white page-scroll overload">软件演示
                                     <div class="service2">
                                         <p style="color: #333">微信扫码</p>
                                         <img src="./images/code.jpg">
                                         <p><span style="color: #333">客服QQ:</span>3052894409</p>
                                     </div>
                                 </a>
-                                <a class="btn-solid-lg page-scroll" style="margin-right: 5rem;" href="http://worktime.ttkuaiban.com/#/login" target="_blank">免费使用</a>
+                                <a class="btn-solid-lg page-scroll" href="http://worktime.ttkuaiban.com/#/login" target="_blank">免费使用</a>
                                 <a class="btn-solid-lg page-scroll" href="./mobile.html" target="_blank">手机版</a>
+                                <!-- <span id="xyz" class="btn-solid-lg page-scroll" >使用说明</span> -->
                             </div>
                         </div>
                     </div>
@@ -125,6 +131,13 @@
         </div>
     </header>
 
+    <script type="text/javascript">
+        let cli = document.getElementById('xyz')
+        cli.addEventListener('click', function(){
+            
+        })
+    </script>
+
     <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
         <div class="modal-dialog modal-lg" role="document">
             <div class="modal-content">
@@ -309,7 +322,8 @@
         </div>
     </div>
 
-    <div id="pricing" class="cards-2">
+    <!-- 定价方案(原版) -->
+    <div id="pricing" class="cards-2" style="display: none;">
         <div class="container">
             <div class="row">
                 <div class="col-lg-12">
@@ -495,6 +509,100 @@
         </div>
     </div>
 
+    <!-- 定价方案(改版) -->
+    <div class="pricing">
+        <div class="container">
+            <div class="scheme">
+                <h2>定价方案</h2>
+            </div>
+            <!-- 主题内容 -->
+            <div class="subject">
+                <!-- 简易版 -->
+                <div id="common" class="common simple">
+                    <div class="upper">
+                        <p>简易版</p>
+                        <p>¥100人/年</p>
+                        <span> <a href="http://worktime.ttkuaiban.com/#/login" target="_blank">立即注册</a></span>
+                    </div>
+                    <div class="middle">
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>技术支持: 工作日</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>30个项目数</p>
+                    </div>
+                    <div class="whole">
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>系统设置</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>系统设置</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>工时填报</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>工时审核</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>按项目统计成本</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>支持PC端,微信端和钉钉填报</p>
+                    </div>
+                </div>
+                <!-- 基础版 -->
+                <div id="common" class="common basics">
+                    <div class="upper">
+                        <p class="sale">基础版</p>
+                        <p>¥250人/年</p>
+                        <span><a href="http://worktime.ttkuaiban.com/#/login" target="_blank">立即注册</a></span>
+                    </div>
+                    <div class="middle">
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>技术支持: 7X24小时</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>不限项目数量</p>
+                    </div>
+                    <div class="whole">
+                        <p class="total">简易版全部功能+</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>系统设置</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>日报数据导出</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>财务核算成本</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>工时自动计时</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>工时自动计时</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>按部门统计成本</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>按人员统计成本</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>支持PC端,微信端和钉钉填报</p>
+                    </div>
+                </div>
+                <!-- 专业版 -->
+                <div id="common" class="common specialty">
+                    <div class="upper">
+                        <p>专业版</p>
+                        <p>¥350人/年</p>
+                        <span><a href="http://worktime.ttkuaiban.com/#/login" target="_blank">立即注册</a></span>
+                    </div>
+                    <div class="middle">
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>技术支持: 7X24小时</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>不限项目数量</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>1对1客服</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>3天免费使用培训</p>
+                    </div>
+                    <div class="whole">
+                        <p class="total">基础版全部功能+</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>专业项目管理</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>系统设置</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>工时填报</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>任务和子任务管理</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>工时审核</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>文件中心</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>按项目统计成本</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>项目数据统计</p>
+                        <p><i><img src="../timesheet/src/assets/image/dui.png" alt=""></i>支持PC端,微信端和钉钉填报</p>
+                    </div>
+                </div>
+            </div>
+            <div class="customization">
+                <h4 class="overload">
+                    定制开发,私有部署以及其他问题,请<span>咨询客服</span>。
+                    <div class="service">
+                        <p style="color: #333">扫码加客服微信</p>
+                        <img src="./images/code.jpg">
+                        <p><span style="color: #333">QQ:</span>3052894409</p>
+                    </div>
+                </h4>
+            </div>
+        </div>
+    </div>
+    <script>
+    </script>
+
+
     <div id="details" class="basic-1">
         <div class="container">
             <div class="row">

BIN
fhKeeper/formulahousekeeper/timesheet/src/assets/image/dui.png