bituni页面数据

assets/css/bituni/index.scss

@@ -126,6 +126,26 @@ body {
   height: 68px;
   
   margin-right: 10px;
+  // border-radius:50%;
+  background-repeat: no-repeat;
+  background-position: center center;
+  background-size: contain;
+  &.logo1{
+    background-image: url("~@/assets/img/bituni/logo_1.png");
+  }
+  &.logo2{
+    background-image: url("~@/assets/img/bituni/logo_2.png");
+  }
+  &.logo3{
+    background-image: url("~@/assets/img/bituni/logo_3.png");
+  }
+  &.logo4{
+    background-image: url("~@/assets/img/bituni/logo_4.png");
+  }
+  &.logo5{
+    background-image: url("~@/assets/img/bituni/logo_5.png");
+  }
+
   img{
       width: 100%;
     height: 100%;
@@ -176,6 +196,8 @@ body {
   font-family: PingFangSC-Medium, PingFang SC;
   font-weight: 500;
   color: #308eff;
+
+  cursor: pointer;
 }
 .page-bituni-case-tips {
   margin-top: 24px;
@@ -186,3 +208,88 @@ body {
   color: #4b5d73;
   line-height: 21px;
 }
+
+
+.word-modal{
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0,0,0,0.7);
+  z-index: 1900;
+  opacity: 1;
+}
+
+.word-modal-main{
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%,-50%);
+  width: 388px;
+  /* height: 216px; */
+  background: #FFFFFF;
+  border-radius: 8px;
+}
+
+.word-modal-title{
+  font-size: 18px;
+font-family: PingFangSC-Medium, PingFang SC;
+font-weight: 500;
+color: #0B121A;
+line-height: 27px;
+text-align: center;
+
+  padding-top: 20px;
+  margin: 0;
+}
+.word-modal-content{
+  margin:6px 16px 0;
+  p{
+    font-size: 14px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #0B121A;
+    line-height: 21px;
+    margin-bottom: 6px;
+  }
+}
+.word-modal-p{
+  overflow: hidden;
+  margin-bottom: 6px;
+}
+
+.word-modal-p span{
+  font-size: 14px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #323233;
+  line-height: 21px;
+}
+
+.word-modal-label{
+  float: left;
+}
+.word-modal-value{
+  float: right
+}
+.word-modal-result{
+  margin-top: 23px;
+  margin-bottom: 20px;
+}
+.word-modal-btn{
+  border-top: 1px solid #E8E8E8;
+  line-height: 51px;
+  text-align: center;
+  font-size: 16px;
+  font-family: PingFangSC-Medium, PingFang SC;
+  font-weight: 500;
+  color: #308EFF;
+  cursor: pointer;
+}
+.fade2-enter-active, .fade2-leave-active {
+  transition: opacity .5s;
+}
+.fade2-enter, .fade2-leave-to /* .fade-leave-active below version 2.1.8 */ {
+opacity: 0;
+}

pages/frontend/bituni/index.vue

@@ -8,10 +8,10 @@
     <div class="page-main">
         <header class="page-bituni-header">
             <h1 class="page-bituni-h1">Bituni-成就你的技术创新</h1>
-            <a class="page-bituni-apply">
+            <a class="page-bituni-apply" href="https://wenjuan.feishu.cn/m/cfm?t=s9QUYzg7geBi-4k35" target="view_window">
                 立即投递
             </a>
-            <p class="page-bituni-rule">投资孵化范围及申请要求</p>
+            <p class="page-bituni-rule" @click="isShowModal = true">投资孵化范围及申请要求</p>
             <section class="page-bituni-intro">
                 <article class="page-bituni-item">
                     <h2>市场验证、种子用户及流量支持</h2>
@@ -31,27 +31,109 @@
                 </article>
             </section>
         </header>
-    
+
         <div class="page-bituni-tit">成功项目</div>
         <div class="page-bituni-case-list">
-            <div class="page-bituni-case-item" v-for='(item,index) in 4' :key="index">
+            <div class="page-bituni-case-item">
+                <div class="bituni-case-item-top">
+                    <div class="page-bituni-case-img logo1">
+                        
+                    </div>
+                    <div class="page-bituni-case-info">
+                        <h2 class="page-bituni-case-name">UniSMS</h2>
+                        <p class="page-bituni-case-content">4343人正在使用</p>
+                        <p class="page-bituni-case-link">https://unisms.apistd.com</p>
+                    </div>
+                    <a class="page-bituni-case-apply" href="https://unisms.apistd.com" target="view_windos">立即使用</a>
+                </div>
+                <div class="page-bituni-case-tips">
+                    敏捷、高速、稳定地发送短信至中国大陆及全球用户。提供开放、透明、一体化的跨通道集成管理系统。
+                </div>
+            </div>
+
+            <div class="page-bituni-case-item">
+                <div class="bituni-case-item-top">
+                    <div class="page-bituni-case-img logo2">
+                        
+                    </div>
+                    <div class="page-bituni-case-info">
+                        <h2 class="page-bituni-case-name">JoyOne</h2>
+                        <p class="page-bituni-case-content">2683人正在使用</p>
+                        <p class="page-bituni-case-link">https://www.jone.work</p>
+                    </div>
+                    <a class="page-bituni-case-apply" href="https://www.jone.work" target="view_windos" >立即使用</a>
+                </div>
+                <div class="page-bituni-case-tips">
+                    研发团队数字化管理系统
+                </div>
+            </div>
+
+            <div class="page-bituni-case-item">
                 <div class="bituni-case-item-top">
-                    <div class="page-bituni-case-img">
-                        <img src="https://iph.href.lu/200x200?fg=666666&bg=cccccc" alt="">
+                    <div class="page-bituni-case-img logo3">
+                        
                     </div>
                     <div class="page-bituni-case-info">
-                        <h2 class="page-bituni-case-name">ZHONG CE POLICY</h2>
-                        <p class="page-bituni-case-content">3683人正在使用</p>
-                        <p class="page-bituni-case-link">https://www.baidu.com</p>
+                        <h2 class="page-bituni-case-name">YesDev</h2>
+                        <p class="page-bituni-case-content">3442人正在使用</p>
+                        <p class="page-bituni-case-link">https://www.yesdev.cn</p>
                     </div>
-                    <a class="page-bituni-case-apply">立即使用</a>
+                    <a class="page-bituni-case-apply" href="https://www.yesdev.cn" target="view_window">立即使用</a>
                 </div>
                 <div class="page-bituni-case-tips">
-                    新一代企业研发生产力工具SAAS服务商，专注5人-500人核心业务研发团队的软件开发。 支持敏捷开发、DevOps、Scrum、硬件项目等多种迭代方式。 覆盖从需求到发布之间的项目协同与管理，为每一名工程师，每一家企业…
+                    协作云，注册即用，是一款研发协同SaaS在线工具，支持多团队协作，支持项目/代码/消息/文档/任务等研发协同。满足敏捷开发、DevOps、Scrum等多种软件迭代方式。
                 </div>
             </div>
+
+            <div class="page-bituni-case-item">
+                <div class="bituni-case-item-top">
+                    <div class="page-bituni-case-img logo4">
+                        
+                    </div>
+                    <div class="page-bituni-case-info">
+                        <h2 class="page-bituni-case-name">YesApi</h2>
+                        <p class="page-bituni-case-content">3933人正在使用</p>
+                        <p class="page-bituni-case-link">http://www.okayapi.com</p>
+                    </div>
+                    <a class="page-bituni-case-apply" href="http://www.okayapi.com" target="view_window" >立即使用</a>
+                </div>
+                <div class="page-bituni-case-tips">
+                    为独立开发者提供后端云低代码开发平台，一个账号，搞定开发，累计提供1000+款免费API！提供云存储、API接口、开放平台等一站式云服务，可用于开发微信小程序、uni-app、安卓应用、触动精灵、易语言、Flutter、iOS应用、Windows桌面应用等。简单、稳定、专业。
+                </div>
+            </div>
+
+            <div class="page-bituni-case-item">
+                <div class="bituni-case-item-top">
+                    <div class="page-bituni-case-img logo5">
+                        
+                    </div>
+                    <div class="page-bituni-case-info">
+                        <h2 class="page-bituni-case-name">开发屋</h2>
+                        <p class="page-bituni-case-content">3432人正在使用</p>
+                        <p class="page-bituni-case-link">https://www.kaifain.com</p>
+                    </div>
+                    <a class="page-bituni-case-apply" href="https://www.kaifain.com" target="view_window" >立即使用</a>
+                </div>
+                <div class="page-bituni-case-tips">
+                    开发屋为企业提供领先的技术解决方案,包括定制化软件系统、网站建设、APP开发、SaaS、PasS、IaaS、API数据服务等,帮助企业数字信息化。 </div>
+            </div>
         </div>
     </div>
+
+    <transition name="fade2">
+        <div class="word-modal" @scroll.stop v-if="isShowModal" @click="isShowModal = false">
+          <div class="word-modal-main" @click.stop="">
+            <div class="word-modal-title">工资计算</div>
+            <div class="word-modal-content">
+              <p>1.项目类型：web3技术类，API serverles类，开发者生产效率工具类，程序框架语言开源类，其他技术驱动类</p>
+              <p>2.公司或团队中有技术类极客创始人或者合伙人</p>
+              <p>3.技术产品驱动，有真实的用户需求，有技术创新及门槛</p>
+              <p>4.远大理想野心抱负，愿意加速商业化发展对接二级市场</p>
+            </div>
+            <div class="word-modal-btn" @click.stop="isShowModal = false">我知道了</div>
+          </div>
+        </div>
+      </transition>
 </div>
 </template>
 
@@ -70,6 +152,7 @@ export default {
             mobile: false,
             // firstLoad: true,
             isWeixinApp: true,
+            isShowModal:false
         }
     },
     head() {